html5 footer header,html-5 --html5教程article、footer、header、nav、section使用

header

header元素是一种具有引导和导航作用的辅助元素。通常，header元素可以包含一个区块的标题(如h1至h6，或者hgroup元素标签)，但也可以包含其他内容，例如数据表格、搜索表单或相关的logo图片。

我们可以使用该元素来写整个页面的标题部分：

The most important heading on this page

同一个页面中，每一个内容区块都可以有自己的元素，例如：

The most important heading on this page

在HTML5中，我们可以不使用div，而用更加语义化的footer来写：

• copyright
• sitemap
• contact
• to top

在同一个页面中可以使用多个元素，即可以用作页面整体的页脚，也可以作为一个内容区块的结尾，例如，我们可以将直接写在或是中：

Section content appears here.

Footer information for section.

Article content appears here.

Footer information for article.

nav  -- 作用 -- 导航栏

nav

nav元素是一个可以用来作为页面导航的链接组；其中的导航元素链接到其他页面或当前页面的其他部分。并不是所有的链接组都要被放进元素；例如，在页脚中通常会有一组链接，包括服务条款、首页、版权声明等；这时使用元素是最恰当的，而不需要元素。

一直以来，我们都习惯用如下这种方式来定义导航条：

• Home
• About
• Blog

下面是W3C给出的一个代码示例：

The Wiki Center Of Exampland

• Home
• Current Events

...more...

Demos in Exampland

Written by A. N. Other.

• Public demonstrations
• Demolitions

...more...

Public demonstrations

...more...

Demolitions

...more...

...more...

Edit | Delete | Rename

© copyright 1998 Exampland Emperor

关键自li，em，dl，ul,ol,footer,header,nav,aside,article

section 版块 用于划分页面上的不同区域,或者划分文章里不同的节 header 页面头部或者版块(section)头部 footer 页面底部或者(section)底部 nav 导航 (包含链接 ...

html5新特性-header,nav,footer,aside,article,section等各元素的详解

Html5新增了27个元素,废弃了16个元素,根据现有的标准规范,把HTML5的元素按优先级定义为结构性属性.级块性元素.行内语义性元素和交互性元素四大类. 下面是对各标签的详解,section.he ...

h5中的结构元素header、nav、article、aside、section、footer介绍

结构元素不具有任何样式,只是使页面元素的的语义更加明确. header元素 header元素是一种具有引导和导航作用的的结构元素,该元素可以包含所有通常放在页面头部的内容.header元素通常用来放置 ...

html5，html5教程

html5,html5教程 1.向后兼容 HTML5是这样被定义的:能向后兼容目前UA处理内容的方式.为了让语言更简单,一些老的元素和Attribute被舍弃.比如一些纯粹用于展现的元素(译注:即非语 ...

一步HTML5教程学会体系

HTML5是HTML最新的版本,万维网联盟. HTML5是下一代的HTML标准,HTML5是为了在移动设备上支持多媒体. 新特性: 绘画的canvas元素,用于媒介回放的video和audio元素,对 ...

IT兄弟连 HTML5教程 了解HTML5的主流应用1

在很多人眼里,HTML5与互联网营销密切相关,但其实从开发者的角度而言,它是一种网页标准,定义了浏览器语言的编写规范.伴随HTML5标准尘埃落定,浏览器对HTML5特性的逐步支持,再加上国内对HTML ...

【转帖】39个让你受益的HTML5教程

39个让你受益的HTML5教程                    闲话少说,本文作者为大家收集了网上学习HTML5的资源,期望它们可以帮助大家更好地学习HTML5. 好人啊! 不过,作者原来说的4 ...

【特别推荐】Web 开发人员必备的经典 HTML5 教程

对于我来说,Web 前端开发是最酷的职业之一,因为你可以用新的技术发挥,创造出一些惊人的东西.唯一的问题是,你需要跟上这个领域的发展脚步,因此,你必须不断的学习,不断的前进.本文将分享能够帮助您快速掌 ...

HTML5教程之本地存储SessionStorage

SessionStorage: 将数据保存在session对象中,所谓session是指用户在浏览某个网站时,从进入网站到浏览器关闭所经过的这段时间会话,也就是用户浏览这个网站所花费的时间就是sess ...

随机推荐

【转】MySQL索引背后的数据结构及算法原理

摘要 本文以MySQL数据库为研究对象,讨论与数据库索引相关的一些话题.特别需要说明的是,MySQL支持诸多存储引擎,而各种存储引擎对索引的支持也各不相同,因此MySQL数据库支持多种索引类型,如BT ...

IIS7 / IIS7.5 URL 重写 HTTP 重定向到 HTTPS(转)

转自: http://www.cnblogs.com/yipu/p/3880518.html   1.购买SSL证书,参考:http://www.cnblogs.com/yipu/p/3722135. ...

OpenGL的glViewPort窗口设置函数实现分屏

之前实现过全景图片查看(OpenGL的几何变换3之内观察全景图),那么我们需要进行分屏该如何实现呢?如下图: 没错就是以前提过的glViewPort函数,废话不多说了,我直接上代码: //从这里开始进 ...

hdu 4764 Stone (巴什博弈，披着狼皮的羊，小样，以为换了身皮就不认识啦)

今天(2013/9/28)长春站,最后一场网络赛! 3~5分钟后有队伍率先发现伪装了的签到题(博弈) 思路: 与取石头的巴什博弈对比 题目要求第一个人取数字在[1,k]间的某数x,后手取x加[1,k] ...

android报表图形引擎(AChartEngine)demo解析与源码

AchartEngine支持多种图表样式,本文介绍两种:线状表和柱状表. AchartEngine有两种启动的方式:一种是通过ChartFactory.get***View()方式来直接获取到view ...

CSS长度单位及区别 em ex px pt in

1.         css相对长度单位 Ø         em          元素的字体高度 Ø         ex           字体x的高度 Ø         px        ...

es6的箭头函数

1.使用语法 : 参数 => 函数语句; 分为以下几种形式 : (1) ()＝>语句 (  )＝> statement 这是一种简写方法省略了花括号和return 相当于 ()＝&g ...

pdfplumber库解析pdf格式

参考地址:https://github.com/jsvine/pdfplumber 简单的pdf转换文本: import pdfplumber with pdfplumber.open(path) a ...

KMP替代算法——字符串Hash

很久以前写的... 今天来谈谈一种用来替代KMP算法的奇葩算法--字符串Hash 例题:给你两个字符串p和s,求出p在s中出现的次数.(字符串长度小于等于1000000) 字符串的Hash 根据字面意 ...

SSM_CRUD新手练习(5)测试mapper

上一篇我们使用逆向工程生成了所需要的bean.dao和对应的mapper.xml文件,并且修改好了我们需要的数据库查询方法. 现在我们来测试一下DAO层,在test包下新建一个MapperTest.j ...