首页 > 站长新闻 > HTML5元素：

HTML5元素：
和

HTML5元素：<Article>和<Section>

        HTML5带出了一系列新元素，并且将在未来被广泛应用。然而，有一些元素在使用时易被混淆，包括以下两个新元素：

和

。

        最常被问起的问题是：在什么情况下我们应该使用这些元素？以及我们应该如何正确的使用这些元素？

Section元素

        这是一个最容易产生歧义的元素。它与

元素有什么区别？我们一直在用

来划分段落，所以除 了

,我们什么时候使用这个元素。我们引用官方文档来阐述它。根据WHATWG文档，对

元素做了以下 描述：

“

元素表示了一篇文档或应用中，通用段落 - WHATWG”

        从描述中我们可以看出

元素的作用就是分段，或多或少类似于

。但是它仍有一个特例。在文档中，加入了一段特别声明：

        “当一个元素仅用于风格样式或是为了脚本的方便，我们鼓励作者使用

。

元素适用于，当元素的内容需要明确的列出时。- WHATWG”

        基于这一点，我们可以总结以下两点：

        第一，尽管section元素在技术上是可以设计样式的，但是当有复杂的样式或脚本时，我们仍建议使用div元素。

        第二，类似于

  • 元素，section元素是用来列举内容的。

            因此在现实例子中，使用

    元素的原因是结构化的列出博客的内容，代码如下：

    HTML5元素：<Article>和<Section>

            这只是个例子，

    元素也可以用作其他用途。

    Article元素

            从名字上，它已经很好的诠释了自己，但是我们仍要看看官方文档上是如何描述它的：

            “在文档，页面，应用或是站点上的一个独立部分，并且大体上，是可独立分配，或是重复使用的，例如在发布时。这个可以是论坛帖子，杂志或是新闻，博客条目，用户提交的评论，互动的小工具或小工具，或任何其他独立项目的内容。”

            从上描述中，我们可以总结出

    元素专用于结构化文章，特别是我们要发布的，例如博客，页面内容或是论坛帖子。

            以下例子给出了如何使用

    构建一个博客文章。

    HTML5元素：<Article>和<Section>

            此外，

    元素还可与section元素结合，需要的时候，可以使用

    元素将文章分为几个段落，如下例所示。

    HTML5元素：<Article>和<Section>

    HTML5元素：<Article>和<Section>

            总结

            如万维网的创始人和W3C的董事所预测的那般，所有HTML5创造出来的新元素都是为了是网络结构更加语义化。如何正确的应用这些元素在网络开发者和设计者之间，仍存有争论。

            无论如何，不要混淆观点。如我之前提出的，只要是合理的情况，且你看到使用了它使得结构变得意义非凡，那么请用它。

    来源：http://www.gbin1.com/technology/html/20130320-html5-elements-section-article/

    • 广告合作
    QQ群号：707632017
    标签：
    articleHTML5section技术用法

    温馨提示：

    1、本网站发布的内容(图片、视频和文字)以原创、转载和分享网络内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。邮箱：2942802716#qq.com（#改为@）。

    2、本站原创内容未经允许不得转裁，转载请注明出处“站长百科”和原文地址。

    相关推荐

    热门教程

    • Z-Blog教程
      Z-Blog教程
      ZBlog教程分享ZBlog安装教程、ZBlog建站教程和ZBlog使用教程等相关教程，包括如何创建...
    • WordPress教程
      WordPress教程
      WordPress教程提供了关于WordPress的基础知识和技巧，包括安装、设置、发布内容、选择主...
    • CSS教程
      CSS教程
      CSS教程提供了关于如何使用CSS来设计和美化网页的基础知识和技巧，包括选择器、样式规则、盒模型、布...
    • 宝塔面板教程
      宝塔面板教程
      宝塔面板教程是一个致力于向用户传授宝塔面板的使用技巧和知识的学习资源，旨在帮助用户快速上手和充分利用...
    • PHP教程
      PHP教程
      PHP教程提供了关于PHP语法、变量、函数、流程控制等概念的详细指导，同时介绍了常见的Web开发技术...

    3个月免费VPS

    亚马逊云科技

    最新文章