HTML语义化标签

什么是语义化？

​ 语义化的目的就是让大家直观的认识标签（markup）和属性（attribute）的用途和作用。

​ 基本上都是围绕着几个主要的标签，像标题（ H1~H6 ）、列表（li）、强调（strong em）等等。
​ 根据内容的结构化（内容语义化），选择合适的标签（代码语义化）便于开发者阅读和写出更优雅的代码的同时让浏览器的爬虫和机器很好地解析。

为什么要语义化？

​ 为了在没有 CSS 的情况下，页面也能呈现出很好地内容结构、代码结构
用户体验：例如 title、 alt 用于解释名词或解释图片信息、 label 标签的活用；

语义化标签

<header></header>
<footer></footer>
<nav></nav>
<section></section>

<article></article>
用来在页面中表示一套结构完整且独立的内容部分

<aslde></aside>
主题的附属信息(用途很广，主要就是一个附属内容)，如果 article 里面为
一篇文章的话，那么文章的作者以及信息内容就是这篇文章的附属内容了

<figure></figure>
媒体元素，比如一些视频，图片啊等等

<datalist></datalist>
选项列表，与 input 元素配合使用，来定义 input 可能的值

<details></details>
用于描述文档或者文档某个部分的细节，默认属性为 open~
ps:配合 summary 一起使用

没有语义的标签

div标签：一行只显示一个（独占一行）。

span标签：一行可以显示多个。