您的位置:首页> 前端教程> HTML教程
文章导航

HTML <section> 标签

2019-7-30 14:57| 作者: admin| 查看: 1863| 评论: 0|来自: 蚂蚁部落

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

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

一.<section>标签作用:

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

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

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

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

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

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

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

二.代码片段:

[HTML] 纯文本查看 复制代码
<article>
  <header>
    <h1>HTML语义化布局</h1>
    <p>发布时间:<time datetime="2019-8-1">2019/08/01</time></p>
  </header>
  <p>文章内容</p>
  <section>
    <h2>评论</h2>
    <article>
      <header>
        <h3>评论者: 蚂蚁部落</h3>
        <p><time datetime="2019-8-1">一分钟前</time></p>
      </header>
      <p>评论内容</p>
     </article>
  </section>
</article>

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

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

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

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

关于<section> 标签可以参阅HTML <article> 标签一章节。

1

鲜花

握手

雷人

路过

鸡蛋

刚表态过的朋友 (1 人)

最新评论

返回顶部