html5语义化标签

1、<section></section>

定义文章中的字节、字段。

2、<article></article>

一个特殊的section标签,比section有更明确的语义。定义来自外部的一个独立的、完整的内容块,例如什么论坛的文章,博客的文本。。。

3、<aside></aside>

用来装载非正文内容,如广告、成组的链接、侧边栏等...

4、<header></header>

定义页眉,通常是一些引导和导航

5、<footer><footer>

定义文档的页脚

6、<nav></nav>

定义一个连接组成的导航栏

7、<hground></hground>

用于对网页或者网段的标题进行组合

8、<figure></figure>

对于元素进行整合

9、<figcaption></figcaption>

figure元素添加标题,一般放于figure的第一个子元素或者最后一个

10、 <details></details>

定义元素的细节用户可以点击查看或者隐藏

11、<summary></summary>

和datails连用,用来包含datails的标题

12、<canvas></canvas>

用来进行canvas绘图

13、<video></video>

定义音频

14、<audio></audio>

定义视频

15、<embed></embed>

定义嵌入网页的内容。比如插件

16、<source><source>

该标签为媒介元素

17、<datalist id='dl'></datalist>

定义可选数据的列表,与input配合使用(<input list='dl>)可制作输入值的下拉列表。

18、<mark></mark>

从视觉上展现用户想要突出的字

19、<meter [min/max/low/high/optimum/value]></meter>

度衡量 用红黄绿表示一个数值所在的范围

20、<output><output>

定义不同的输出类型,样式与span无异

21、<progress></progress>

进度条,运行中的进度

22、<time></time>

定义日期或时间

23、<keygen></keygen>

定义加密的内容

24、<command></command>

定义命令行为

为什么要使用语义化标签?

语义化标签顾名思义,见到标签就能知道里面的内容,使得页面更加清晰,方便维护和开发

html块及标签

<address>.....</address>

 <center>......<center>地址文字

h1-h6标题标签

<hr/>分割线

<p></p>段落

<pre></pre>预格式化

<blockquote></blockquote>段落缩进

<marquee></marquee>滚动文本

<ul>...</ul>无序列表

<ol></ol>无序列表

<dl></dl>定义列表

<table></table>表格

<form></form>表单

<div></div>

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 语义化标签,顾名思义也就是可以直接读懂的标签。最早接触HTML5的时候,对HTML5的语义化并没有太深的理解,只是...
    极客人阅读 4,213评论 1 18
  • HTML 5的革新之一:语义化标签一节元素标签。 html5的布局 节点元素标签分为:节元素标签、文本元素标签、分...
    Bookish倩宝阅读 561评论 0 2
  • 什么是语义化? 简单说来就是让机器可以读懂内容。 语义化的优点: 搜索引擎的爬虫依赖于标记来确定上下文和各个关键字...
    古朋阅读 522评论 0 5
  • HTML <!DOCTYPE> 标签 <!DOCTYPE> 声明必须是 HTML 文档的第一行,位于 标签之前...
    深沉的简单阅读 1,488评论 0 0
  • 1.语义化标签总结 基础布局标签 注意:IE8以后不兼容H5标签,如果需要兼容IE8一下的浏览器,则需要如下操作:...
    枫丶筱阅读 477评论 0 0