html5新增构造:html主体构造和非主体构造的介绍-
1 新增的主体构造元素
1.1 article元素
代表文档、页面或利用程序中独立的、完备的、可以单独被外部援用的内容。(如一篇博客或报章杂志中的文章)
1.2 section元素
用来对网站或利用程序中页面上的内容进行分块。(如对文章分段)
1.3 nav元素
是一个可以用来作为页面导航的链接组,其中的导航元素链接到其他页面或目前页面的其他局部。
1.4 aside元素
用来表示目前页面或文章的附属信息局部,它可以包括与目前页面或主要内容相干的援用、侧边栏、广告、导航条,以及其他相似的有别于主要内容的局部。
2 新增的非主体构造元素
2.1 header元素
是一种拥有指导和导航作用的构造元素,平常用来放置整个页面或页面内的一个内容区块的标题,但也可以包括其他内容,例如数据表格、搜寻表单或相干的LOGO图片。
2.2 footer元素
可以作为其上层父级内容区块或一个根区块的足注。平常包含器相干区块的足注信息,如作者、相干浏览链接以及版权信息等。
2.3 address元素
用来在文档中呈现联络信息,包含文档作者或文档保护者的名字、文档作者或文档保护者的网站链接、电子邮箱、真实地址、电话号码等。
2.4 main元素
表示网页中的主要内容。
(1)主内容区域指与网页标题或利用程序中页面主要功能直接相干或进行扩展的内容。该区域应当为每一个网页中所特有的内容,不克不及包含整个网站的导航条、版权信息、网站LOGO、公共搜寻表单等整个网站内部的共同内容。
(2)每个网页内部只能放置一个main元素。
(3)不克不及将main元素放置在任何article、aside、footer、header或nav元素内部。
3 对新的构造元素运用样式
(1)由于许多阅读器尚未对H5中新增的构造元素供给支撑,我们没法晓得客户端运用的阅读器可否支撑这些元素,所以需要运用CSS追加如下声明,目的是通知阅读器页面运用的H5中的新增元素都是以块方式显示的,如下所示:
//追加block声明 article,aside,dialog,figure,footer,header,legend,nav,section,main{ display:block;} //正常运用样式 nav { float : left ; width:20% } article { float:right ; width:79% }
(2)IE8及更早版本不支撑运用CSS的办法来运用这些尚未支撑的构造元素,需要运用Javascript足本。
//足本中新建元素 《script》 document.createElement("header"); document.createElement("nav"); document.createElement("article"); document.createElement("footer"); document.createElement("main"); 《script》