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

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

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

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

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

一、section标签实例

 1 <!doctype html>
 2 <article>
 3     <h1>Web编程语言比较</h1>
 4     <p>web编程语言常用的有asp,asp.net,php,jsp...</p>
 5     <section>
 6         <h2>asp</h2>
 7         <p>asp全称Active Server Page</p>
 8     </section>
 9     <section>
10         <h2>asp.net</h2>
11         <p>asp的颠覆版本</p>
12     </section>
13     <section>
14         <h2>php</h2>
15         <p>草根动态语言,免费,强大</p>
16     </section>
17 </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>。

转载于:https://www.cnblogs.com/yangyongjie/p/7524753.html

h5 中的 section 标签相关推荐

  1. html5中还有div吗,关于html5中的section标签与div标签的区别(内有实例)

    摘要 腾兴网为您分享:关于html5中的section标签与div标签的区别(内有实例),周公解梦,智学网,学习计时,完美root等软件知识,以及网上预约医院软件,字体预览软件,铁血联盟卷土重来,海量 ...

  2. html5 section与div,关于html5中的section标签与div标签的区别(内有实例)

    本篇文章主要的想大家介绍了关于HTML5 section标签和div标签的区别,section和div的用法看似相近,实则差的也不是太多,有些地方可以相互转换都行,但有些地方只能用section或者只 ...

  3. html中section与div,如何在html中的section标签内包含div标签

    我正在制作一个完整版块的页面网站,如this.每个页面都有自己的标签.目前我的网页有4个部分(呈现不同的背景颜色).如何在html中的section标签内包含div标签 我的第一部分有一个容器div, ...

  4. html5 video js控制摄像头的焦距,H5中使用video标签实现选择摄像头功能的示例

    H5中使用video标签实现选择摄像头功能的示例 发布时间:2020-12-05 10:48:03 来源:亿速云 阅读:91 作者:小新 小编给大家分享一下H5中使用video标签实现选择摄像头功能的 ...

  5. 使用H5中的video标签时,页面中间显示“暂停”图标;点击播放,图标消失;点击暂停,图标出现(play、pause、ended)

    有时候我们在做项目的过程中会遇到这样的需求: 使用H5中的video标签播放一个视频,并在视频的中心位置放置一个暂停的图标,点击后视频播放,图标消失:再次点击后,视频暂停,图标出现. 想要的效果,例下 ...

  6. 图片在section上下居中_HTML5中的section标签是什么?HTML5中的section标签怎么居中?...

    HTML5中的section标签是什么?HTML5中的section标签怎么居中?本篇文章就详细地为大家举出了实例,方便大家的观看,其中的HTML5中section的定义和作用,都有实例在里面.(后面 ...

  7. Html中的section标签

    section> 标签是 HTML5 中的新标签 块级元素 标签的作用是对页面上的内容进行分块,或者说对文章进行分段,请不要与有着自己的完整的.独立的内容"的article元素混淆. ...

  8. 文章中很多section标签。对收录有影响吗?

    有时候在微信复制一小段文字,都会有很多这个标签,还有别的网站, 有时候复制字段文字过来,发出去包含在div中, 经常出现<p><div>xxxxx</div>< ...

  9. C# 配置文件中添加自定义section标签获取数据

    前言:在添加获取配置文件自定义section 特性的数据时,遇到了问题并把它记录下来: 1. 类型"xxxxx.xxxx.sectionName"不从"System.Co ...

最新文章

  1. 导师对帮助研究生顺利完成学业提出了20条劝告:第一,不要有度假休息的打算.....
  2. 马斯克的星际飞船又炸了!回收时发动机重启失败,「横」着砸向地面
  3. android在Service,BroadCast onReceiver()中弹出Dialog对话框
  4. Vue.js 计算属性和侦听器
  5. .Net Core3.0依赖注入DI
  6. ChemBioDraw 制作DMT屏保
  7. Storm消费Kafka异常 - topic其中两个分区达到某个值不进行消费,持续阻塞
  8. java先执行static还是构造函数_【Java基础】类的实例化、static、父类构造函数执行顺序...
  9. [需求管理-6]:需求分析 - 技术可行性研究与方案设计模板
  10. matlab mac问题,mac版的matlab出现问题,有大神帮忙看一下吗
  11. Bandicam安装
  12. 石墨烯的晶格和能带结构
  13. K倍交叉验证配对t检验
  14. 英语常用口语1000句
  15. hadoop-bigdata-v2.2 版本shell脚本一键部署 master、slaver1、slaver2三个节点源代码.
  16. java在web里被禁用_JavaWEB_Session被禁用的后果和解决方法
  17. 西电计科数据库系统期末复习笔记
  18. xy苹果助手未受信任_苹果应用掉证书?突然打不开怎么办?
  19. JSD-2204-API-线程并发-集合-Day08
  20. python中write什么意思_python file write () 方法概括及作用分析(实例)

热门文章

  1. springboot踩坑日记—nacos: Error watching Nacos Service change
  2. 感冒不一定要吃药,11个不用药方法
  3. 公式编辑器mathtype中一些符号显示方框,如何解决呢?
  4. php怎么安装模板_phpcms模板怎么安装
  5. android 自定义view 高度,自定义View之宽高的设置,全网最详解
  6. 2022深信服Python开发岗面试
  7. 想要jweixin.js的看这里
  8. android10系统是平板电脑吗,Windows 10适用于Android平板电脑
  9. rpn产生proposals_一文读懂RPN和ROI Align
  10. javax.net.ssl.SSLHandshakeException: Received fatal alert: certificate_unknown