结构
一般来说，html 的标签就包含两个： head（元数据） 和 body（文档）
通俗一点的话就是，<head> 像是你的身份证，只会给有需要看的人看，而 <body> 则是所有人都能看到。
下面以百度为例，简单介绍一下哈ヽ(ー_ー)ノ
| head 常见标签 | 描述 | 常见地方 | 属性 | 重要程度 |
|---|---|---|---|---|
| <title></title> | 页面标题，相当于人的名字 | - | 非常重要。例：seo 优化 | |
| <meta> | 没有被单独成为一个标签的元数据集合，由于其为空内容元素，所以不需要结束标签 | name、content、http-equiv... | 非常重要。例：seo 优化、编译类型等等 | |
| <style></style> | 页面文档的样式集合 | 整个页面 | type、midea... | 非常重要。例：视觉的展示 |
| <script></script> | 引入脚本文档 | 整个页面 | src、async... | 非必要。除非特殊用途，一般放在 body 底部 |
| body常见标签 | 描述 |
|---|---|
| <h1> ~ <h6> | 各层级标题，在需要seo的页面上最好都设有 h1 标签 |
| <a> | 超链接，可以说是网站的核心，可支持外部与当前页跳转（锚点） |
| <address> | 联系信息 |
| <article> | 独立结构，模块或单页 |
| <aside> | 与其余页面内容无关，多表现为侧边框或注释 |
| <audio> | 音频 |
| <b> | 特别注意内容，如需粗体请改用 css |
| <br> | 换行 |
| <button> | 按钮 |
| <canvas> | 画图 |
| <del> | 删除线 |
| <div> | 万金油块级元素 |
| <footer> | 最近一个根节点元素的页脚 |
| <form> | 表单验证 |
| <header> | 介绍性内容 |
| <iframe> | 嵌套 html |
| <img> | 图像 |
| <input> | 输入框 |
| <label> | 其他元素的说明，一般用 for 加 目标元素的 id 进行关联，也可以直接包裹目标元素 |
| <li> | 列表条目 |
| <link> | 外部资源链接 |
| <main> | 主体，应只用一次 |
| <nav> | 导航栏 |
| <noscript> | 当脚本内容被拦截后展示的内容 |
| <p> | 文本段落 |
| <picture> | 其中包含 <source> 标签来定义最适合场景的图像版本，输出图像在子元素 <img> 中 |
| <pre> | 按照文件编排输出 |
| <progress> | 进度条 |
| <section> | 独立章节 |
| <span> | 万金油行内元素 |
| <table> | 展示表格 |
语义化标签是为了让搜索引擎更好的读懂以及找到我们的页面。
也是 seo 优化的其中一项哟 (￣▽￣)~
当我们了解了大概的标签之后，我们就可以尝试拉动新世界大门的把手啦~
芜湖~
撒花✿✿ヽ(°▽°)ノ✿
（未完待续...）
参考资料：
MDN标签：传送门 (～￣▽￣)～
