点击这里给我发消息 点击这里给我发消息

HTML5结构元素:section

添加时间:2013-12-6
    相关阅读: 页面 数据库 程序 HTML CSS 网站
HTML5新增主要结构元素-section元素,section元素用于对网站或应用程序中页面上的内容进行分块。一个section元素通常由内容及其标题组成。但section元素并非一个普通的容器元素;当一个容器需要被直接定义样式或通过脚本定义行为时,推荐使用div而非section元素。

我们可以这样理解:section元素中的内容可以单独存储到数据库中或输出到word中。
  section元素示例
<section><h1>苹果</h1><p>苹果文章正文</p></section>

通常不推荐为那些没有标题的内容使用section元素,可以使用HTML5轮廓工具来检查页面中是否有没标题的section。

section元素的作用是对页面上的内容进行分块,或者说对分钟进行分段,请不要与“有着自己的完整的、独立的内容”的article元素混淆。这里POST两段section元素与article元素混合使用的示例代码

 

section元素示例一

section元素示例二

这两段示例代码很容易让人糊涂,这两个元素可以互换使用吗?他们的区别到底是什么呢?事实上,在HTML5中,article元素可以看成是一种特殊种类的section元素,它比section元素更强调独立性。即section元素强调分成段或分块,而article强调独立性。具体来说,如果一块内容相对来说比较独立、完整的时候,应该使用article元素,但是如果你想将一块内容分成几段的时候,应该使用section元素,另外,在HTML5中,div元素变成了一种容器,当使用CSS样式的时候,可以对这个容器进行一个总体的CSS样式的套用。

最后,关于section元素的使用禁忌总结如下:

1)不要将section元素用作设置样式的页面容器,那是div元素的工作

2)如果article元素、aside元素或nav元素更符合使用条件,不要使用section元素

3)不要为没有标题的内容区块使用section元素

咨询热线:020-85648757 85648755 85648616 0755-27912581 客服:020-85648756 0755-27912581 业务传真:020-32579052
广州市网景网络科技有限公司 Copyright◎2003-2008 Veelink.com. All Rights Reserved.
广州商务地址:广东省广州市黄埔大道中203号(海景园区)海景花园C栋501室
= 深圳商务地址:深圳市宝源路华丰宝源大厦606
研发中心:广东广州市天河软件园海景园区 粤ICP备05103322号 工商注册