HTML5所有标签汇总及标签意义解释
- 不言原创
- 2018-05-08 15:51:232416浏览
这篇文章主要介绍了HTML5所有标签汇总及标签意义解释,本文总结了结构标签、多媒体交互标签、Web应用标签、注释标签、其他标签等内容,需要的朋友可以参考下
结构标签：(块状元素) 有意义的p
23c3de37f2f9ebcb477c4a90aac6fffd 标记定义一篇文章
1aa9e5d373740b65a0cc8f0a02150c53 标记定义一个页面或一个区域的头部
c787b9a589a3ece771e842a6176cf8e9 标记定义导航链接
2f8332c8dcfd5c7dec030a070bf652c3 标记定义一个区域
15221ee8cba27fc1d7a26c47a001eb9b 标记定义页面内容部分的侧边栏
d8eccd9ed644b68a6460a2bb84548c82 标记定义文件中一个区块的相关信息
24203f2f45e6606542ba09fd2181843a 标记定义一组媒体内容以及它们的标题
614eb9dc63b3fb809437a716aa228d24 标签定义 figure 元素的标题。
c37f8231a37e88427e62669260f0074d 标记定义一个页面或一个区域的底部
a38fd2622755924ad24c0fc5f0b4d412 标记定义一个对话框(会话框)类似微信
多媒体交互标签
39000f942b2545a5315c57fa3276f220 标记定义一个视频
b97864c2e0ef2353a16c4d64c7734e92 标记定义音频内容
e02da388656c3265154666b7c71a8ddc 标记定义媒体资源
5ba626b379994d53f7acf72a64f9b697 标记定义图片
d8e2720730be5ddc9c2a3782839e8eb6 标记定义外部的可交互的内容或插件 比如flash
Web应用标签
5c0e96d12fc7501cef2ae2efde646ee0命令列表
9b8d7b889acba92c978f783c55ba01dcmenu命令列表标签 FF（嵌入系统）
e2b9f03cad787b9644e1f51fd23b7dac menu标记定义一个命令按钮
49c6123c49c6be380cb91db06cd3bfa9状态标签(实时状态显示:气压、气温)C、O
6ecb87e5318a36c03c59e25d55f43372状态标签 (任务过程:安装、加载) C、F、O
fc86e7b705049fc9d4fccc89a2e80ee3 为input标记定义一个下拉列表,配合option F、O
a5e9d42b316b6d06c62de0deffc36939 标记定义一个元素的详细内容 ，配合dt、dd C
注释标签
ec41f2147470148e85ad0337a362103e 标记定义 注释或音标
515718f19dfe6612658be14be18aa0ec 告诉那些不支持 Ruby元素的浏览器如何去显示
7240f116d85a7ee375466871bc33670a 标记定义对ruby的注释内容文本
其他标签
aa983b9eb8086376f1f6481364a02e5a 标记定义表单里一个生成的键值(加密信息传送)O、F
f920514e6447cf1d171079d1371f007f 标记定义有标记的文本 (黄色选中状态)
be6d67dae90cc1ad6469079e163d0939 标记定义一些输出类型,计算表单结果配合oninput事
删除的HTML标签
纯表现的元素：
basefont，big，center，font, s，strike，tt，u；
对可用性产生负面影响的元素：
frame，frameset，noframes；
产生混淆的元素：
acronym ，applet，isindex，dir
重新定义的HTML标签
a4b561c25d9afb9ac8dc4d70affff419 代表内联文本，通常是粗体，没有传递表示重要的意思
5a8028ccc7a7e27417bff9f05adf5932 代表内联文本，通常是斜体，没有传递表示重要的意思
67bc4f89d416b0b8236eaa5f43dee742 可以同details与figure一同使用，定义包含文本，dialog也可用
73de882deff7a050a357292d0a1fca94 可以同details与figure一同使用，汇总细节，dialog也可用
f32b48428a809b51f04d3228cdf461fa 表示主题结束，而不是水平线，虽然显示相同
5c0e96d12fc7501cef2ae2efde646ee0 重新定义用户界面的菜单，配合commond或者menuitem使用
d015d241ae6d34c34210679b5204fe85 表示小字体，例如打印注释或者法律条款
8e99a69fbe029cd4e2b854e244eab143 表示重要性而不是强调符号
示例代码：
XML/HTML Code复制内容到剪贴板
<xmp>
<!doctype html>
<html>
<head>
<style>
header{height:150px;background:#ABCDEF}
nav{height:30px;background:#ff9900;margin-top:100px}
nav ul li{width:100px;height:30px;float:left;line-height:30px}
div{margin-top:10px;height:1000px;}
section{height:1000px;background:#ABCDEF;width:70%;float:left}
article{background:#F90;width:500px;margin:0 auto;text-align:center}
aside{height:1000px;background:#ABCDEF;width:28%;float:right}
footer{height:100px;background:#ABCDEF;clear:both;margin-top:10px}
</style>
</head>
<body>
<header>
<p>这是一个header标签</p>
<nav>
<ul>
<li>首页</li>
<li>起夜</li>
<li>论坛</li>
<li>商城</li>
<li>社区</li>
</ul>
</nav>
</header>
<div>
<section>
<p>这是一个section标签</p>
<article>
<h2>春晓</h2>
<p>
春眠不觉晓，<br />
处处蚊子咬，<br />
打上敌敌畏，<br />
不至死多少。<br />
</p>
</article>
<hr />
<article>
<h2>上学歌</h2>
<p>
太阳当空照，<br />
花儿对我笑，<br />
小鸟说早早早，你为什么背上小书包?<br />
我要炸学校老师不知道，一拉线，赶快跑，<br />
轰的一声，学校炸没了。<br />
</p>
</article>
<hr />
<figure>
<figcaption>UFO</figcaption>
<p>不明飞行物 Unknown Flying Object</p>
</figure>
<figure>
<dt>DDS</dt>
<dd>大屌丝</dd>
</figure>
<hr />
<dialog>
<dt>唐僧:悟空，你又调皮了，观音姐姐的月光宝盒怎么能乱扔呢？</dt>
<dd>悟空:...(看着)</dd>
<dt>唐僧:乱扔是不对的，砸到小朋友怎么办？就算砸不到小朋友，砸到花花草草也是不好的嘛</dt>
<dd>悟空:...(纠结)</dd>
<dt>唐僧:悟空你想要么？想要你就告诉我呀，你不告诉我怎么知道你想要呢？。。。。</dt>
<dd>悟空:我靠!(一棍子抡上去！)</dd>
</dialog>
<hr />
<menu>
<li>点击</li>
<li>右键单击</li>
</menu>
<hr />
<span contextmenu="candan">右键单击我试试</span>
<menu type="context" id="candan">
<menuitem label="菜单一" onclick="alert('我是一个寂寞')" icon="http://www.baidu.com/img/baidu_sylogo1.gif"></menuitem>
</menu>
<hr />
<meter min="0" max="10" value="5" low="3" high="7" ></meter>
<progress max="100" value="0" id="pro"></progress>
<script>
var pro =document.getElementByIdx_x_x_x('pro');
setInterval(function(){
pro.value+=1;
},100);
</script>
<hr />
<details>
<dt>这是一个问题？</dt>
<dd>to be or not to be</dd>
<dt>这是一个问题？</dt>
<dd>to be or not to be</dd>
<dt>这是一个问题？</dt>
<dd>to be or not to be</dd>
</details>
<hr />
<ruby>夼<rp>(</rp><rt>kuang</rt><rp>)</rp></ruby>
<hr />
女人<mark>最喜欢做的事情</mark>就是逛街。。。吃零食。。逛街。。吃零食，偶尔还会呜呜的哭，
于是总结了下女人:逛吃逛吃逛吃逛吃。。。呜呜呜~·
</section>
<aside>
<p>这是一个aside标签</p>
<hgroup>
<h3>女生宿舍为何频频被盗</h3>
<h3>两百头母猪为何半夜惨死</h3>
<h3>是人性的扭曲？</h3>
<h3>还是道德的沦丧！</h3>
</hgroup>
</aside>
</div>
<footer>
<p>这是一个footer标签</p>
<hr />
<small>法律条文</small>
<small>联系我们</small>
<small>客户意见</small>
<small>商户合作</small>
</footer>
</body>
</html>
</xmp>以上是HTML5所有标签汇总及标签意义解释的详细内容。更多信息请关注PHP中文网其他相关文章！