div、section、article 的区别(2)
作者:糖伴西红柿 来源:前端观察 发布时间:2011-02-26 15:39:00
article
HTML Spec: “The article element represents a self-contained composition in a document, page, application, or site and that is, in principle, independently distributable or reusable, e.g. in syndication.”
article 是一个特殊的 section 标签,它比 section 具有更明确的语义, 它代表一个独立的、完整的相关内容块。一般来说, article 会有标题部分(通常包含在 header 内),有时也会 包含 footer 。虽然 section 也是带有主题性的一块内容,但是无论从结构上还是内容上来说,article 本身就是独立的、完整的。
HTML Spec 中接着又列举了一些 article 适用的场景。 “This could be a forum post, a magazine or newspaper article, a blog entry, a user-submitted comment, an interactive widget or gadget, or any other independent item of content.”
当 article 内嵌 article 时,原则上来说,内部的 article 的内容是和外层的 article 内容是相关的。例如,一篇博客文章中,包含用户提交的评论的 article 就应该潜逃在包含博客文章 article 之中。
问题是怎么才算“完整的独立内容”?有个最简单的判断方法是看这段内容在 RSS feed 中是不是完整的。看这段内容脱离了所在的语境,是否还是完整的、独立的。
例子:
<article>
<header>
<h1>The Very First Rule of Life</h1>
<p><time pubdate datetime="2009-10-09T14:28-08:00"></time></p>
</header>
<p>If there's a microphone anywhere near you, assume it's hot and
sending whatever you're saying to the world. Seriously.</p>
<p>...</p>
<footer>
<a href="?comments=1">Show comments...</a>
</footer>
</article><article>
<header>
<h1>The Very First Rule of Life</h1>
<p><time pubdate datetime="2009-10-09T14:28-08:00"></time></p>
</header>
<p>If there's a microphone anywhere near you, assume it's hot and
sending whatever you're saying to the world. Seriously.</p>
<p>...</p>
<section>
<h1>Comments</h1>
<article>
<footer>
<p>Posted by: George Washington</p>
<p><time pubdate datetime="2009-10-10T19:10-08:00"></time></p>
</footer>
<p>Yeah! Especially when talking about your lobbyist friends!</p>
</article>
<article>
<footer>
<p>Posted by: George Hammond</p>
<p><time pubdate datetime="2009-10-10T19:15-08:00"></time></p>
</footer>
<p>Hey, you have the same first name as me.</p>
</article>
</section>
</article>


猜你喜欢
- 前言如果你对数据分析有一定的了解,那你一定听说过一些亲民好用的数据分析的工具,如Excel、Tableau、PowerBI等等等等,它们都是
- 用Python+OpenCV实现了自动扫雷,突破世界记录,我们先来看一下效果吧。中级 - 0.74秒 3BV/S=60.81相信许多人很早就
- 函数就是把具有独立功能的代码块封装成一个小模块,可以直接调用,从而提高代码的编写效率以及重用性, 需要注意的是, 函数需要被调用才会执行,
- ADODB.Stream在ASP编程中往往用于无组件上传,并且可以指定文件编码,可以应对各种不同的需要。但是在使用ADODB.Stream过
- fixHtmlTag version 0.2 这个版本解决了上次遗留的问题,即就近闭合和嵌套闭合问题。具体可以看代码的注释。 <?ph
- 形参可以设置参数默认值,设置遵循从右至左原则例如:fun(x=0,y=1),fun(x,y=1),但不可以是fun(x=1,y)形参设置可以
- 在之前的Python办公自动化案专题中,我们已经介绍了如何有选择的提取某些页面进行合并。但是很多时候,我们并不会预知希望提取的页号,而是希望
- 本文试图从iPhone的角度结合一些iPhone平台项目的设计经验提炼出iPhone平台的一些优秀设计思路,以供大家在做移动互联网设备设计时
- 本文实现利用python的socketserver这个强大的模块实现套接字的并发,具体内容如下目录结构如下:测试文件请放在server_fi
- 我的PJBlog在从2.7升级的3.0的时候,犹豫了很久。升级到PJBlog3.0就是看中了新增的静态页面功能,但是同时又担心造成博客出现大
- 以下是一些Python实用技巧和工具,希望能对大家有所帮助。交换变量x = 6y = 5x, y = y, xprint x>>
- 前言本文主要给大家介绍了关于微信小程序自定义导航的相关内容,详细代码请见github,请点击地址 (本地下载),其中有原生小程序的
- 在Linux下安装Oracle数据库是一件较为麻烦的事情。由于Linux的安装过程中可能会选择不同的安装包,会导致Oracle安装过程中缺失
- MySQL Workbench 是一款专为 MySQL 设计的集成化桌面软件,也是下一代的可视化数据库设计、管理的工具,它同时有开源和商业化
- eval是Python的一个内置函数,功能十分强大,这个函数的作用是,返回传入字符串的表达式的结果。就是说:将字符串当成有效的表达式 来求值
- 导读只需要添加几行代码,就可以得到更快速,更省显存的PyTorch模型。你知道吗,在1986年Geoffrey Hinton就在Nature
- #创建触发器,当往order表中添加记录是,更新goods表 delimiter $ CREATE TRIGGER trigger1 AFT
- 相信很多小伙伴平时写python的时候都是需要调试程序的,出问题了,需要了解函数内部是怎么跑的,而这个时候很多人都会想到在疑惑的地方使用pr
- 获取CPU信息我们先来获取CPU的信息:>>> import psutil>>> psutil.cpu_
- 首先我们来安装python1、首先进入网站下载:点击打开链接(或自己输入网址https://www.python.org/downloads