首页 > 代码库 > HTML5的结构学习(2) --- 新增的非主体结构元素
HTML5的结构学习(2) --- 新增的非主体结构元素
除了上一篇学习到的主体结构元素之外，html5还增加了一些表示逻辑结构和附加信息的非主体结构元素：
1.header
解释：一种具有引导和导航作用的结构元素。
用途：通常用来放置整个页面或者页面内某一内容区块的标题部分。如标题名称、logo图片等。
<header><h1>大标题</h1></header> <article> <header><h1>文章内容标题</h1></header> <p>正文内容</p> </article>
在html5中一个header元素至少要包含一个heading元素（h1~h5）或者新增的hgroup元素。
<header> <hgroup> <h1>Paper的博客</h1> <a href="xxx"> xxx </a> <a href="#">[订阅]</a> <a href="#">[手机订阅]</a> </hgroup> <nav> <ul> <li>首页</li> <li>博文目录</li> <li>图片</li> <li>关于我</li> </ul> </nav> </header>
2.hgroup
解释：是将标题和其子标题分组的元素
用途：包含一组标题
<article> <header> <hgroup> <h1>主标题</h1> <h2>子标题</h2> </hgroup> <p> <time datetime="2014/09/19"> 2014年9月19日 </time> </p> </header> <p>正文内容</p> </article>
注意：文章只有一个标题时不需要使用hgroup
3.footer
解释：作为上层父级区块或者根区块的一个注脚
用途：一般用来包括作者或者链接的相关信息，网站版权等等注脚信息。
<footer> <ul> <li>版权信息</li> <li>站点地图</li> <li>联系方式</li> </ul> </footer>
注意：footer元素同时也可以存在于section和article区块中，用来表示section区块或者article内容的注脚信息。
4.address
解释：用来在文档中呈现联系信息
用途：用来表示文档作者的名字、网站链接、邮件地址和电话号码等。
比如说网站中的友情链接：
<aside> <address> <a href="xxx">同志a</a> <a href="xxx">同志b</a> <a href="xxx">同志c</a> </address> </aside>
HTML5的结构学习(2) --- 新增的非主体结构元素
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。