转自  http://www.studyofnet.com/news/331.html

本文导读:<section> 标签定义文档中的节(section、区段)。比如章节、页眉、页脚或文档中的其他部分。section元素标签用来表现普通的文档内容或应用区块。一个section通常由内容及其标题组成,但section元素标签并非一个普通的容器元素;当一个容器需要被直接定义样式或通过脚本定义行为时,推荐使用div元素而非section。

section 字面上理解为“块”,“部分”,section元素代表一个页面或一个内容块的部分,一般作为主题块列表,在html5网页中表现的意思跟字面理解差不多,即部分,块,模块,主要作用为对页面的内容进行分块或者对文章的内容进行分段。

section标签是成对出现的,以<section>开始,以</section>结束

section标签通常带有一个标题和一个内容块。

一、section标签实例

 <!doctype html>
<article>
<h1>Web编程语言比较</h1>
<p>web编程语言常用的有asp,asp.net,php,jsp...</p>
<section>
<h2>asp</h2>
<p>asp全称Active Server Page</p>
</section>
<section>
<h2>asp.net</h2>
<p>asp的颠覆版本</p>
</section>
<section>
<h2>php</h2>
<p>草根动态语言,免费,强大</p>
</section>
</article>

二、article与section的异同

section和article可以互相嵌套,也就是说他们没有上下级关系,section可以包含article,article也可以包含section。
感觉上使用都差不多,都可以有h1,h2,h3,都有一个主体,那应该怎么来区分它们的不同?其实很简单,只要从字面上理解它们就可以足够了:
1、article是文章,文章就是一段完整的独立的内容。
2、section就是块,某种意义上可以理解为div,但是比div的意思更加明确一点。

三、section和div的异同

1、section和div都可以对内容进行分块,但是section是进行有意义的分块,无意义的分块应该由div来做,例如用作设置样式的页面容器。
2、section内部必须有标题,标题也代表了section的意义所在。

四、使用<section>标签需要注意的地方

1、不要将<section>作为用来设置样式或行为的“钩子”容器,那是<div>的工作。
2、如果<article>、<aside>或<nav>更符合状况,不要使用<section>。
3、不要为没有标题的内容区块使用<section>。

最新文章

  1. jQuery-1.9.1源码分析系列(九) CSS操作
  2. linux下将不同线程绑定到不同core和cpu上——pthread_setaffinity_np
  3. supervisor拉起daemon进程(falcon-agent)测试
  4. Elasticsearch推荐插件篇(head,sense,marvel)
  5. 对ASM存储管理的一些初步理解记录
  6. 自定义Dialog之信息提示
  7. 50个jquery代码片段(转)
  8. [UOJ#34]多项式乘法
  9. 【LeetCode OJ】Pascal&#39;s Triangle II
  10. Effective Java 学习笔记----第7章 通用程序设计
  11. C语言--const修饰指针解析
  12. php文件处理
  13. ezw证件照芯片压缩算法
  14. oracle存储过程的例子
  15. mysql的数据类型与列属性
  16. 测试中出现ERROR StatusLogger No log4j2 configuration file
  17. python爬虫-1
  18. Typescript 学习笔记三:函数
  19. spring boot学习总结(一)-- 基础入门 Hello,spring boot!
  20. Core Data Tutorial for IOS: Getting Started

热门文章

  1. Mysql系列九:使用zookeeper管理远程Mycat配置文件、Mycat监控、Mycat数据迁移(扩容)
  2. 说说自己对RESTful API的理解
  3. expect脚本同步文件 expect脚本指定host和要同步的文件 构建文件分发系统 批量远程执行命令
  4. Ubuntu 14.04 配置VNC服务 配置Xfce4桌面
  5. easyGUI 用法介绍
  6. H5 (webApi) 接口帮助文档
  7. PHP-CLI环境变量的设置和读取
  8. SQL Server2008 删除登录记录
  9. B - 取(2堆)石子游戏
  10. Zookeeper中Session Timeout的那些事