现在写H5项目,还是使用以前的标签,今天特意把H5的标签整理出来,监督自己些项目要使用新的标签。
H5的语义化标签:
1.<header></header>:主要用于页面的头部的信息介绍,也可用于板块头部
2.<section></section>:页面上的版块用于划分页面上的不同区域,或者划分文章里不同的节
3.<footer></footer>:页脚,页面的底部或板块的底部
4.<hgroup></hgroup>页面上一个标题的组合(一个标题或一个子标题的组合,或者标语的组合)
列如:<hgroup>
<h1>标题1</h1>
<h2>标题2</h2>
</hgroup>
5.<nav></nav>:导航(包含链接的一个列表)、
列如:<nav>
<p><a href="javascript:void(0)">列表1</a></p>
<p><a href="javascript:void(0)">列表2</a></p>
</nav>
6.<article></article>:用来在页面中表示一套结构完整且独立的内容部分(一篇文章,博客等等)
7.<aside></aside>:元素标签可以包含与当前页面或主要内容相关的引用、侧边栏、广告、nav元素组,以及其他类似的有别与主要内容的部分
8.<address></address>:定义文章,作者的详细的联系信息
9.<mark></mark>:需要标记的词或句子
10.<time></time>:用来表示时间或日期
列如:<time>9:16</time>
<time datetime="2018-2-14">情人节</time>
11.<figure></figure>:用于对元素进行组合,一般用于图片或视频
<figcaption></figcaption> :figure的子元素,用于对figure进行说明
列如:<figure>
<img src="">
<figcaption></figcaption>
</figure>
12.<datalist></datalist>:选项列表。一般与input配合使用,用来定义input的可能值
列如:<input type="text" name="" list="valList">
<datalist id="valList">
<option value="javascript">javascript</option>
<option value="html">html</option>
<option value="h5">h5</option>
</datalist>
13.<details></details>:用来描述某个文档或某个文档的细节。
<summary></summary>:details元素的标题
Open:是默认打开
<details open="">
<summary>美国</summary>
<p>美国是一个高度发达的资本主义国家,其政治、经济、军事、文化、创新等实力领衔全球。</p>
</details>
14. <dialog></dialog>:定义一段对话
列如:
<dialog open="">
<dt>你喜欢美国吗?</dt>
<dd>喜欢</dd>
<dt>你喜欢美国饮食吗?</dt>
<dd>喜欢</dd>
</dialog>
15.<progress max="120" value="50" >:用来定义进度条
16.<keygen>给表单添加一个公钥
列如:
<form action="http://www.baidu.com" method="get">
用户: <input type="text" name="usr_name" />
公钥: <keygen name="security" autofocus="" />
<input type="submit" />
</form>