HTML5 header标签的定义与规定

yumo6664个月前 (07-06)技术文章76

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

<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设计自学平台》

相关文章

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

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

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

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

vscode 快速生成 html 代码技巧

快速生成 Html5 骨架在 Html 文件中输入 html:5 按下回车键,可快速生成 HTML5 页面模板:<!DOCTYPE html> <html lang="en&...

《从零开始学前端:HTML+CSS+JavaScript的黄金三角》

为什么说HTML5+CSS3+JavaScript是前端的黄金三角?想象一下,你想盖一座房子: HTML5是地基,决定房屋的骨架和结构; CSS3 是装修,让房子变得美观、舒适; JavaScr...

聊聊html5那点事

文章简介:关于html5相信大家早已经耳熟能详,但是他真正的意义在具体的开发中会有什么作用呢?相对于html,他又有怎样的新的定义与新理念在里面呢?为什么一些专家认为html5完全完成后,所有的工作都...