资讯

精准传达 • 有效沟通

从品牌网站建设到网络营销策划,从策略到执行的一站式服务

HTML5语义化标记Section和Article怎么用-创新互联

小编给大家分享一下HTML5语义化标记Section和Article怎么用,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!

双牌ssl适用于网站、小程序/APP、API接口等需要进行数据传输应用场景,ssl证书未来市场广阔!成为创新互联的ssl证书销售渠道,可以享受市场价格4-6折优惠!如果有意向欢迎电话联系或者加微信:18982081108(备注:SSL证书合作)期待与您的合作!

Section元素

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

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

来划分段落,所以除 了

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

元素做了以下 描述:

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

从描述中我们可以看出

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

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

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

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

基于这一点,我们可以总结以下两点:

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

第二,类似于

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

    因此在现实例子中,使用

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

      
          
            Blog Post Title  
            Ice cream tart powder jelly-o.   
            Gummies chocolate cake ice cream cookie halvah tiramisu jelly-o.

           
                      Blog Post Title           Ice cream tart powder jelly-o.            Gummies chocolate cake ice cream cookie halvah tiramisu jelly-o.

           
  •                   Blog Post Title           Ice cream tart powder jelly-o.            Gummies chocolate cake ice cream cookie halvah tiramisu jelly-o.

           
      

    这只是个例子,

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

    Article元素

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

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

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

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

    以下例子给出了如何使用

    构建一个博客文章。

      
        
           

    This is Blog Post Title

                      
                     Author Name               Save in Categories           
           

           
                      Sweet roll halvah biscuit toffee liquorice tart pudding sesame snaps.            Biscuit powder jelly-o fruitcake faworki chocolate bar. Pudding oatnbon. Gummies            halvah gummies danish biscuit applicak            cake tootsie roll sesame snaps lollipop gingerbread boe gingerbread jelly-o pastry.       

      

    此外,

    元素还可与section元素结合,需要的时候,可以使用
    元素将文章分为几个段落,如下例所示。

      
        
           

    This is Blog Post Title

                      
                     Author Name               Save in Categories           
           

           
                      
               

    This is the Sub-Heading

               Sweet roll halvah biscuit toffee liquorice tart pudding sesame snaps.            Biscuit powder jelly-o fruitcake faworki chocolate bar. Pudding oat cake            tootsie roll sesame snaps lollipop gingerbread bonbon. Gummies halvah            gummies danish biscuit applicake gingerbread jelly-o pastry.           
               
               

    This is another Sub-Heading

               Topping cheesecake sweet pie carrot cake sweet roll. Gummi bears lemon drops           toffee sesame snaps tart topping chupa chups apple pie gummies. Wafer chocolate           cake. Sugar plum chocolate bar topping ice cream carrot cake danish bonbon.            Cheesecake gummi bears dragée jujubes dragée dragée brownie jelly biscuit.          Powder croissant jelly beans pastry.           
           

      

    以上是“HTML5语义化标记Section和Article怎么用”这篇文章的所有内容,感谢各位的阅读!相信大家都有了一定的了解,希望分享的内容对大家有所帮助,如果还想学习更多知识,欢迎关注创新互联成都网站设计公司行业资讯频道!

    另外有需要云服务器可以了解下创新互联scvps.cn,海内外云服务器15元起步,三天无理由+7*72小时售后在线,公司持有idc许可证,提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案,具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势,专为企业上云打造定制,能够满足用户丰富、多元化的应用场景需求。


    名称栏目:HTML5语义化标记Section和Article怎么用-创新互联
    文章地址:http://cdkjz.cn/article/dopshi.html
    多年建站经验

    多一份参考,总有益处

    联系快上网,免费获得专属《策划方案》及报价

    咨询相关问题或预约面谈,可以通过以下方式与我们联系

    大客户专线   成都:13518219792   座机:028-86922220