HTML < section> 标签

小灰灰 2020-05-15 17:58 938阅读 0赞

HTML <section> 标签

<section>是HTML5新增的语义化标签之一。

关于语义化标签的概念与作用可以参阅HTML 语义化布局概述一章节。

一.标签作用:

此标签的功能与<article>标签比较类似,两者联系与区别简单总结如下:

(1).<article>可以认为是特殊<section>

(2).<article>更加强调独立性,语义更加明确。

(3).<section>虽然也具有一定独立性,更加强调对完整的内容划分区块。

artice翻译成汉语具有”文章”的意思,section翻译成汉语具有”章”或者”区”的意思。

如果说<article>标签标示一篇完整的文章,那么<section>就可以标示一篇完整文章中的段落或者章节。

但是不能因此就说,<section>标签从属于<article>标签,它们是可以互相嵌套的。

二.代码片段:

  1. <article>
  2. <header>
  3. <h1>HTML语义化布局</h1>
  4. <p>发布时间:<time datetime="2019-8-1">2019/08/01</time></p>
  5. </header>
  6. <p>文章内容</p>
  7. <section>
  8. <h2>评论</h2>
  9. <article>
  10. <header>
  11. <h3>评论者: 蒲公英云</h3>
  12. <p><time datetime="2019-8-1">一分钟前</time></p>
  13. </header>
  14. <p>评论内容</p>
  15. </article>
  16. </section>
  17. </article>

上述是一个涉及到<section> 标签的代码片段,分析如下:

(1).整体通过<article>标签生成一篇文章。

(2).评论区域是文章的一部分或者一个”章节”,那么使用<section> 标签。

(3).评论区域中的每一条评论可以看做独立的内容,所以可以用<article>生成。

发表评论

表情:
评论列表 (有 0 条评论,938人围观)

还没有评论,来说两句吧...

相关阅读

    相关 HTML标签

    标签语义化 标签语义化就是表示标签的含义 1. 方便阅读,维护 2. 浏览器,爬虫能够更好的解析 3. 搜索引擎的优化 > 原则 先确定语义的HTML,再选择