HTML5 header标签的定义与规定

yumo6667小时前技术文章3

提示:点击上方"蓝色字体"↑ 可以订阅噢!

<header>标签定义文档的页面组合,通常是一些引导和导航信息(DOM接口、可设置属性)。

<header>标签定义文档的页眉(介绍信息)。

Header区的例子包含了页面标题和副标题,<header>标签被用来创建页面的Header区的内容。除了网页本身之外,<header>标签还可以包含关于<section>和<article>的公开信息。这里创建的网页有该页面的一个Header区,这在高层设计中有给出,以及一个位于Article和Section区内部的Header区。清单1提供了一个<header>标签标记的例子。

<!--<header>标签的例子-->

?

1

2

3

4

5

6

7

8

9

<header>

<h1>标题文字</h1>

<p>文本或是图像可放在这里</p>

<p>Logo通常也放在这个地方</p>

</header>

<header>标签还可以包含一个<hgroup>标签,如清单2所示。<hgroup>标签把标题分组放在一起,使用<h1>到<h6&这些标题分级来在此处显示主标题和子标题。

view source print?

<!-->hgroup<标签的例子-->

?

1

2

3

4

5

6

7

8

9

10

11

12

13

<header>

<hgroup>

<h1>主标题&/h1>

<h2>子标题</h2>

</hgroup>

<p>文本或是图像可放在这里</p>

</header>

想认识志同道合的朋友一起学习web

加入我们的学习QQ群 190166743

丰富的学习资源,周一到周四免费直播公开课

长按图片,识别二维码即可入群

你可能感兴趣的精彩内容

长按关注:《UI设计自学平台》

相关文章

Html5实现下拉菜单

话不多说,直奔主题<!--html代码--> <div> <ul> <li><a href="#home" clas...

《响应式开发》16个最佳响应式HTML5框架分享

HTML5框架可以快速构建响应式网站,它们帮助程序员减少编码工作,减少冗余的代码。如今有很多免费的HTML5框架可供使用,由于它们有着响应式设计、跨浏览器兼容、相对轻量级等特点,这些框架在开发中都十分...

推荐15个最好的HTML5移动模板 (一)

当你创造了一个应用程序,现在你想展示给世界,那么你可以创建一个网站或登陆页面。因此,我们可以利用HTML5模板,这样就可以轻松地在互联网上公布。这些模板可以快速的提高您的业务。当你设计一个登陆页面的移...

HTML5教程从入门到精通,随堂笔记(一)HTML5框架结构

HTML5从入门到精通,兄弟连京修随堂笔记(一)HTML的框架结构,每日都有新内容,订阅走一波一个浏览器窗体可以通过几个页面的组合来显示。我们可以使用框架来完成(frames)这项工作。(框架可以把H...

HTML5入门

什么是HTML5官方概念:HTML5草案的前身名为Web Applications 1.0,是作为下一代互联网标准,用于取代html4与xhtml1 的新一代标准版本,所以叫html5。它增加了新的标...