div section article ,语义是从无到有,逐渐增强的。div 无任何语义,仅仅用作样式化或者脚本化的钩子(hook),对于一段主题性的内容,则就适用 section,而假如这段内容可以脱离上下文,作为完整的独立存在的一段内容,则就适用 article。原则上来说,能使用 article 的时候,也是可以使用 section 的,但是实际上,假如使用 article 更合适,那么就不要使用 section 。nav 和 aside 的使用也是如此,这两个标签也是特殊的 section,在使用 nav 和 aside 更合适的情况下,也不要使用 section 了。

对于 div 和 section、
article 以及其他标签的区分比较简单。对于 section 和 article
的区分乍看比较难,其实重点就是看看这段内容脱离了整体是不是还能作为一个完整的、独立的内容而存在,这里面的重点又在完整身上。因为其实说起来 section
包含的内容也能算作独立的一块,但是它只能算是组成整体的一部分,article 才是一个完整的整体。

div section article区分--20150227的更多相关文章

  1. HTML5 中 div section article 的区别

    刚刚开始接触 HTML5 时,对它的标签很不适应,甚至一度有点反感.尤其是对 div.section.article 这几个标签,实在弄不清楚应该使用在什么场合下. div HTML Spec: Th ...

  2. div section article aside的理解

    div 是一个大的容器 内部可以包含header main nav aside footer等标签 没有语义,多用于为脚本添加样式 section的语义比div语义强些,用于主题性比较强的内容,比如一 ...

  3. 2018.7.18 div,section,article的区别和使用

    section ·<section> 标签定义文档中的节(section.区段).比如章节.页眉.页脚或文档中的其他部分. ·section用作一段有专题性的内容,一般在它里面会带有标题. ...

  4. HTML5中div,article,section的区别

    最近正在学习html5,刚接触html5,感觉有点不适应,因为有一些标签改变了,特别是div, section article这三个标签,查了一些资料,也试着用html5和css3布局网页,稍微有点头 ...

  5. section元素与div、article元素的区别

    section元素是对网站或应用程序中页面上的内容进行分块,一个section元素通常有标题和内容组成.但section元素并非一个普通的容器元素,当一个容器需要直接定义样式或通过脚本定义行为时,推荐 ...

  6. html5之div,article,section区别与应用

    div 块级元素,在里面的内容会自动开始新行,可以定义文档中的分区或节,把文档分割成独立,不同的部分 本身没有什么语义,更适合帮助布局,进行样式化. <div> </div> ...

  7. 对于指定区块div,如何区分区块内的点击 和 区块外的点击?

    需求:对于区块div内点击事件, 需要展示区块内的附属操作区块,对于区块外的点击, 需要将前面说的附属操作区块隐藏掉. 分析:对于一般的HTML控件,有标准的js事件接口, focus和blur,来实 ...

  8. HTML中的div,section,article的区别

    刚开始看到标签的就有些疑惑,觉得为什么有那么多相同用途的标签,多方查询资料细细比较之后才发现原来各有千秋,结合自己的想法总结如下: div在HTML早期版本就支持了,section和article是H ...

  9. <section> 标签

    最近正在学习html5,刚接触html5,感觉有点不适应,因为有一些标签改变了,特别是div, section article这三个标签,查了一些资料,也试着用html5和css3布局网页,稍微有点头 ...

随机推荐

  1. P5175 数列(矩阵加速)

    //minamoto #include<bits/stdc++.h> #define R register #define ll long long #define fp(i,a,b) f ...

  2. DOM0、DOM2级事件

    JavaScript DOM0.DOM2级事件 1.DOM0级事件:on+事件类型 在html行内直接绑定,也就是通过行内js绑定的例如<span onclick="alert('1' ...

  3. Apache与Tomcat的区别和联系

    经常在用apache和tomcat等这些服务器,可是总感觉还是不清楚他们之间有什么关系,在用tomcat的时候总出现apache,总感到迷惑,到底谁是主谁是次,因此特意在网上查询了一些这方面的资料,总 ...

  4. Elasticsearch and MongoDb

    http://www.linkedin.com/groups/Difference-between-elasticsearch-MongoDB-3393294.S.588764405916973056 ...

  5. JavaScript 对象的原型扩展(JS面向对象中的继承)

    <script type="text/javascript"> function person(name, age) { this._name = name; this ...

  6. iOS开发:创建推送开发证书和生产证书,以及往极光推送官网上传证书的步骤方法

    在极光官网上面上传应用的极光推送证书的实质其实就是上传导出的p12文件,在极光推送应用管理里面,需要上传两个p12文件,一个是生产证书,一个是开发证书 ,缺一不可,具体如下所示: 在开发者账号里面创建 ...

  7. python 基础(七) 异常处理

    异常处理 一.需求 当遇到错误的时候 不让程序停止执行 而是越过错误继续执行 二.主体结构 (抓取所有异常) try:   可能出现异常的代码段 except:   出现异常以后的处理   三.处理特 ...

  8. 网络流--Dinic(自用,勿看)

    注意:这是一篇个人学习笔记,如果有人因为某些原因点了进来并且要看一下,请一定谨慎地阅读,因为可能存在各种奇怪的错误,如果有人发现错误请指出谢谢! https://www.luogu.org/probl ...

  9. python shutil

    #! /usr/bin/env python# -*- coding:utf-8 -*-# shutil 高级的文件.文件夹.压缩包处理模块import shutil #1.copyfileobj(源 ...

  10. 106 Construct Binary Tree from Inorder and Postorder Traversal 从中序与后序遍历序列构造二叉树

    给定一棵树的中序遍历与后序遍历,依据此构造二叉树.注意:你可以假设树中没有重复的元素.例如,给出中序遍历 = [9,3,15,20,7]后序遍历 = [9,15,7,20,3]返回如下的二叉树:    ...