HTML5的<header>元素

我们在平常做网站定义网站头部如果用DIV的话那么就会这样:

<div id="header">
  .......
</div>

我们现在来看看HTML5提供的元素 <header>:

<header>
  <h1>www.bianceng.cn</h1>
</header>

另外一点就是每一个页面上,并不局限仅使用一个<header>来定义头部,你也可以使用多个<header>元素,例如:

<header>
  <h1>www.bianceng.cn</h1>
</header>
<article>
  <header>
    <h1>这是文章列表</h1>
  </header>
  <p>...这是其他文本!...</p>
</article>

时间: 2024-08-17 17:17:02

HTML5的&lt;header&gt;元素的相关文章

HTML5的&amp;lt;footer&amp;gt;元素

既然HTML5提供了<header>那也应该有尾部吧?呵呵,还真有. 我们在定义网站尾部,像版权等信息通常是这样定义的: <div id="footer"> <ul> <li>版权声明</li> <li>站点地图</li> <li>联系我们</li> <li>...</li> </ul> </div> 看看HTML5<foot

《HTML5开发手册》——第1章 HTML5中新的结构元素 第1章 HTML5中新的结构元素

第1章 HTML5中新的结构元素 HTML5并不是一种具有JavaScript API和酷炫视频的交互式巫术.它有20多个新的元素,可以用来开发Web页面.添加语义以交付容易访问的可重用内容. 在后面章节,我们将学习新的HTML5表单控件和多媒体元素.本章主要讲解新的结构元素,如header.hgroup.nav.footer.article.section和aside.你将知道何时以及如何单独或组合使用这些新元素.实际上,你还将学会利用这些新元素创建一个基本的网站模板,如图1.1所示. 1.1

html5 time 标签的datetime元素又不在页面显示有什么用

问题描述 html5 time 标签的datetime元素又不在页面显示有什么用 如题 //2014年5月25日 在网页中只显示2014年5月25日,那么datetime元素又有什么用 同理还有pubdate元素 求科普 解决方案 http://zhidao.baidu.com/link?url=vqWR1E92D0BVRkJW5oMnQsfQQ2ss2SAA4tiIj5y7Dt8argoiZgYL_lr_VtzGiUUYnxja22hxcEA--2JCNANREK 解决方案二: 我也搞不清这玩

Html5 Canva中绘制的元素添加鼠标事件实例教程

使用jTopo给Html5 Canva中绘制的元素添加鼠标事件 使用Html5的时候,在Canvas上绘制的东西是不能相应鼠标事件的,但是使用jTopo添加事件非常简单,效果如下: 代码示例: var node = new JTopo.Node("Hello"); node.setLocation(409, 269); node.mousedown(function(event){ if(event.button == 2){ node.text = '按下右键'; }else if(

HTML5中新增的结构元素介绍

在之前的HTML页面中,大家基本上都是用了Div+CSS的布局方式.而seo/seo.html" target="_blank">搜索引擎去抓取页面的内容的时候,它只能猜测你的某个Div内的内容是文章内容容器,或者是导航模块的容器,或者是作者介绍的容器等等.也就是说整个HTML文档结构定义不清晰,HTML5中为了解决这个问题,专门添加了:页眉.页脚.导航.文章内容等跟结构相关的结构元素标签. 1.section    2.article    3.aside    4.

HTML5 新增和移除元素命令介绍

HTML5新增的多媒体及交互式元素 video, audio... details, menu, command... HTML5新增的结构元素 header, footer, section, article, nav... HTML5新增的块级语义及行内元素 aside, figure, dialog... time, meter, mark, progress... HTML5新增的表单控件 email, url, datetime, number, range, color... HTM

HTML5教程:如何使用details元素和summary元素

文章简介:details 和 summary 元素. 曾几何时,我们创建可以显示/隐藏一些内容的小组件时,我们不得不使用Javascript.有时候你可能不得不为这个小功能,下载一个完整的 JS 库才能达到这个功能效果.为下面的时刻欢呼吧!HTML5提供了创建这种拖拽特点的方法,我们仅仅需要简单的几行html代码就能获得这种效果(从目前而言,这种效果还依赖于使用的浏览器,当然,在不久的将来,这可能不是问题).下面让我们一起来看看 <detail>元素. 下面就是规范中的描述 The detai

HTML5的Menu和Menuitem元素快速创建实用菜单实例

今天向你介绍HTML 5中的两个元素:Menu和Menuitem,这两个元素是W3C交互元素中的一部分.现在Web的演变已经不仅仅局限于文档之间的链接,在APPs中,页面的行为越来越多,因此,是时候形成一个Web交互的标准了. Menu和Menuitem是在开发者中谈论最热门的两个元素,可能是由于主流浏览器对其缺乏足够的支持.在我写这篇文章的时候,FireFox已经实现了这个元素. Menu和Nav的对比 当谈到Menu时,难免不和Nav元素混淆.区分这两个元素,文档规范是一个不错的工具. Na

《HTML5多媒体应用开发》——1.3 主要的HTML5结构化元素

1.3 主要的HTML5结构化元素 本书讨论的任何HTML5多媒体元素和API自然都需要编写HTML标记.你当然可以使用HTML 4.01标记(但是你必须使用本小节提到的HTML5 DOCTYPE元素),但是因为本书是关于HTML5多媒体的,对你来说使用HTML5标记更有意义.本书和网站上的所有例子都使用HTML5标记. 下面,让我们从组成HTML5文档的主要结构化元素的简单介绍开始. 1.3.1 DOCTYPE和Charset 和任何HTML文档一样,你必须用一个DOCTYPE作为HTML5文