HTML 相关知识点详细总结
1. HTML基础结构
1.1 文档类型声明
代码语言：javascript复制htmlCopy code<!DOCTYPE html>1.2 HTML文档结构
代码语言：javascript复制htmlCopy code<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<!-- 页面内容 -->
</body>
</html>2. HTML元素
2.1 标签和内容
代码语言：javascript复制htmlCopy code<tag>内容</tag>2.2 常见HTML元素
- 标题标签：
<h1>to<h6> - 段落标签：
<p> - 超链接标签：
<a href="url">链接文本</a> - 图片标签：
<img src="image.jpg" alt="Description"> - 列表标签：htmlCopy code<ul> <li>无序列表项</li> </ul> <ol> <li>有序列表项</li> </ol>
- 表格标签：htmlCopy code<table> <thead> <tr> <th>表头单元格</th> </tr> </thead> <tbody> <tr> <td>表格单元格</td> </tr> </tbody> </table>
3. HTML属性
3.1 常见HTML属性
- class和id属性：htmlCopy code<div class="container" id="uniqueID">内容</div>
- src属性（图片）：
<img src="image.jpg" alt="Description"> - href属性（超链接）：
<a href="url">链接文本</a>
4. HTML表单
4.1 表单基本结构
代码语言：javascript复制htmlCopy code<form action="/submit" method="post">
<!-- 表单元素 -->
</form>4.2 常见表单元素
- 文本框：
<input type="text" name="username"> - 密码框：
<input type="password" name="password"> - 单选框和复选框：htmlCopy code<input type="radio" name="gender" value="male"> Male <input type="checkbox" name="subscribe" value="yes"> Subscribe
- 下拉菜单：htmlCopy code<select name="country"> <option value="us">United States</option> </select>
- 提交按钮：
<button type="submit">提交</button>
5. HTML语义化
5.1 语义化标签
<header>,<footer><nav><article>,<section>
6. HTML嵌套与文档流
6.1 嵌套结构
HTML元素可以嵌套，形成文档树结构。
6.2 文档流
HTML中元素默认按照其在文档中的位置依次排列，形成文档流。
7. HTML5新增特性
7.1 新标签
<header>,<footer>,<nav><article>,<section>,<aside>
7.2 多媒体元素
<audio>,<video>
7.3 表单增强
<datalist>,<output>
我正在参与2024腾讯技术创作特训营第五期有奖征文，快来和我瓜分大奖！
