h5 新增主题结构元素article、aside、nav、seciton、time

来源:互联网 发布:cf聊天软件下载 编辑:程序博客网 时间:2024/05/19 06:36

article元素

代表文档、页面或应用程序中独立的、完整的、可以独自被外部引用的内容。该元素可嵌套使用;可用来表示插件。

<article><header><h1>靴子</h1><p>圣诞老人有个大靴子</p></header><!--article内嵌--><article><header>我是嵌套内容头部</header><p>我是嵌套内容中部</p><footer>我是嵌套部分底部</footer></article><footer><p>还是红色的</p></footer></article><!--表示插件 --><article><h1>这是一个内嵌页面</h1><object><embed src="#" width="600px" height="300px"></embed></object></article>

aside元素

用来表示当前页面或者文章的附属信息部分,可包含于当前页面或蛀牙内容相关的引用、侧边栏、广告、导航条,以及其他类似的有区别于主要内容的部分

<!--用法1,对article的名词解释--><header><h1>article用法1</h1></header><article><h1>内容</h1><p>学习的内容</p><aside><h1>主要内容</h1><p>这是一个学习</p></aside></article><!--用法2,在article外使用,作为页面的附属信息部分,例侧边栏--><aside><nav><h2>aside用法2</h2><ul><li><a href="#">世界那么大,不多看看就死多可惜</a></li></ul></nav></aside>

nav元素

是一个可以用作页面导航的连接组,其中的导航元素连接到其他页面或当前页面的其他部分。并非所有链接组都要放进nav元素,只需将主要的、基本的放进即可

应用场景:传统导航条、侧边栏导航、页内导航、翻页导航

h5中不要用menu元素代替nav元素,menu元素使用在发出命令的菜单上,是一个交互元素

<nav><ul><li><a href="#">第一行</a></li><li><a href="#">第二行</a></li></ul></nav><article><header><h1>nav</h1><nav><ul><li><a href="#">第三个</a></li><li><a href="#">第四个</a></li></ul></nav></header><section><h1>hh</h1><p>你是</p></section><section><h1>mm</h1><p>茶杯</p></section><footer><a href="#">护手霜</a><a href="#">糯米糕</a></footer></article><footer><p><small>什么</small></p></footer>

section元素

用于对网站或应用程序中页面上的内容进行分块,一个section元素通常由内容及标题组成。但当一个容器需要被直接定义样式或通过脚本定义行为时,推荐使用div。

section元素强调分段或分块,一块内容分为几段或几块;article元素强调独立性,一块内容独立完整

注意:不要讲section元素作为设置样式的容器(div);如果article、aside、nav元素丰富和使用条件,那不要用section;没有标题内容区域块,不要用section

time元素

<time datetime="2015-1-1">2015-1-1</time><br /><!--T表示日期与时间的分隔符;Z机器编码使用的utc标准时间;+时间是表示时差--><time datetime="2015-1-1T20:00">2015-1-1T20:00</time><br /><time datetime="2015-1-1T20:00Z">2015-1-1T20:00Z</time><br /><time datetime="2015-1-1T20:00+09:00">2015-1-1T20:00+09:00</time>

pubdate属性

可选布尔类型属性,可用在article元素中time元素上,代表整个文章或整个网页的发布日期

<article><header><h1>xx</h1><p>日期<time datetime="2016-1-1" pubdate>2016-1-1</time></p></header></article>

阅读全文
0 0