原文地址:https://stackoverflow.com/questions/33910294/what-is-the-difference-between-article-and-section-in-html5

<section>标签 :

section,汉语意思为部分,这个标签定义网页上的每个单独部分,比如页眉,导航栏,页脚,或者其他的具有联系的部分。简单的来说任何具有逻辑的整体都可以放在section标签下,包括article标签。

 <article> 标签:

article标签是section标签下一个独立的内容块。

article 元素适用场景:

  • 讨论区
  • 个人博客
  • 新闻文章
  • 评论区

这些标签都是语义化标签,他们的设计目的就是让网页逻辑更加得清晰,section标签类似于div标签,它包裹具有任何具有逻辑的部分(比如一篇文章),如有问题,欢迎评论。

获取更多信息请参考:

HTML 5的革新——语义化标签section和article的区别的更多相关文章

  1. HTML 5的革新——语义化标签(一)HTML 5的革新——语义化标签(二)

    HTML 5的革新之一:语义化标签一节元素标签. 在HTML 5出来之前,我们用div来表示页面章节,但是这些div都没有实际意义.(即使我们用css样式的id和class形容这块内容的意义).这些标 ...

  2. HTML 5的革新——语义化标签(一)

    HTML 5的革新之一:语义化标签一节元素标签. 在HTML 5出来之前,我们用div来表示页面章节,但是这些div都没有实际意义.(即使我们用css样式的id和class形容这块内容的意义).这些标 ...

  3. HTML 5的革新——语义化标签

    感谢原文作者:html5jscss 原文链接:http://www.html5jscss.com/html5-semantics-section.html 大佬的下一篇博文:http://www.ht ...

  4. HTML 5的革新——语义化标签(二)

    HTML 5的革新之一:语义化标签二文本元素标签.分组元素标签. HTML 5的革新——语义化标签(一)中介绍了一些HTML5新加的一些节元素,一张页面中结构元素构成网页大体,但是也需要其他内容来填充 ...

  5. HTML 5的革新之一:语义化标签一节元素标签。

    摘至于:<HTML 5的革新——语义化标签(一)> HTML 5的革新之一:语义化标签一节元素标签. 在HTML 5出来之前,我们用div来表示页面章节,但是这些div都没有实际意义.(即 ...

  6. HTML5之语义化标签

    HTML 5的革新之一:语义化标签一节元素标签. 在HTML 5出来之前,我们用div来表示页面章节,但是这些div都没有实际意义.(即使我们用css样式的id和class形容这块内容的意义).这些标 ...

  7. html5语义化标签总结二

    HTML 5的革新之一:语义化标签二文本元素标签.分组元素标签. HTML 5的革新——语义化标签(一)中介绍了一些HTML5新加的一些节元素,一张页面中结构元素构成网页大体,但是也需要其他内容来填充 ...

  8. 笔记二:常用的h5语义化标签

    0.前言: 所谓语义化标签就是一种 我们仅通过标签名就能判断出该标签内容的语义的标签,见名知意. 总结这部分内容,主要是为了能从繁琐的div嵌套div中,改成带有h5标签码.这样更有利于读写代码. 人 ...

  9. 第二季第十一天 html5语义化标签 css透明度

    span不能设置宽高背景 HTML5语义化标签 <section>标签所包裹的是有一组相似的主题的内容,可以用这个标签来实现文章的章节.标签式对话框中的各种标签页等类似的功能. <s ...

随机推荐

  1. 00004-form 表单的清空、重置 (jquery)

    form 表单的清空.重置 $(':input').not(':button, :submit, :reset').val('').removeAttr('selected').removeAttr( ...

  2. [Abp vNext 入坑分享] - 7.Automapper与validation的使用

    简要说明 [项目源码] [章节目录] 本文主要介绍Automapper与Validation的使用方法.首先使用Automapper的目的是引入组件完成entity与dto之间的转换以达到简化代码的目 ...

  3. MySQL事务操作

    在 MySQL 命令行的默认设置下,事务都是自动提交的,即执行 SQL 语句后就会马上执行 COMMIT 操作.因此要显式地开启一个事务务须使用命令 BEGIN 或 START TRANSACTION ...

  4. Python 图像处理 OpenCV (3):图像属性、图像感兴趣 ROI 区域及通道处理

    前文传送门: 「Python 图像处理 OpenCV (1):入门」 「Python 图像处理 OpenCV (2):像素处理与 Numpy 操作以及 Matplotlib 显示图像」 图像属性 图像 ...

  5. zabbix 自定义指标数据来源

    1.cpu load https://blog.csdn.net/scugxl/article/details/77199403 1)基本含义:运行队列长度,表示当前有多少个正在等待的进程和正在执行的 ...

  6. kudu_单master集群安装

    1.配置JDK1.7/1.8,免密设置,ntp时间同步配置. 2. 将下载下来的文件放到/etc/yum.repos.d/ 目录下后,进行下一步 3.使用yum管理器安装 (集群搭建) sudo yu ...

  7. js倒计时 手机休眠时 时间不进行减少

    http://www.111cn.net/wy/js-ajax/94218.htm 手机版网页js倒计时存在的问题与解决的方法 www.111cn.net 更新:2015-09-16 编辑:kp123 ...

  8. 你真的了解负载均衡中间件nginx吗?

    前言 nginx可所谓是如今最好用的软件级别的负载均衡了.通过nginx的高性能,并发能力强,占用内存下的特点,可以搭建高性能的代理服务.同时nginx还能作为web服务器,反向代理,动静分离服务器. ...

  9. Git基本操作命令合集

    平时自己敲敲代码,使用Git命令也渐渐多了起来.使用起来的确很方便,今天来分享下Git基本概念和本地代码提交到github上的过程,很简单的,多操作几次就会了. Git定义 Git 是一个开源的分布式 ...

  10. 201771010117马兴德 实验二 Java基本程序设计(1)

    实验二 Java基本程序设计(1)  第一部分    理论知识的学习. 第三章Java基本程序设计结构 1  基本知识: (1)标识符:标识符由字母.下划线.美元符号和数字组成,且第一个符号不能为数字 ...