详解HTML5中的<aside>元素与<article>元素

日期:2021-01-19 类型:科技新闻 

关键词:微信公众号平台小程序,微信打分小程序,小程序发布,小程序大全,微信小程序编程

<aside>元素
HTML<aside>元素表明1个网页页面的1一部分, 它的內容跟这个网页页面的其它內容的关系性不强,或是沒有关系,独立存在。<aside>元素一般显示信息成侧面栏(sidebar)或1些插进填补內容。一般用来在侧面栏显示信息1些界定,例如文件目录、数据库索引、术语表等;还可以用来显示信息有关的广告宣传宣传策划,作者的详细介绍,Web运用,有关连接,当今页內容简介等。

<aside>元素应用留意事项:

    不必应用<aside>元素标识括号中的文本,由于这类种类的文字被觉得是主內容的1一部分。

应用事例:

XML/HTML Code拷贝內容到剪贴板
  1. <article>  
  2.   <p>  
  3.     The Disney movie <em>The Little Mermaid</em> was   
  4.     first released to theatres in 1989.   
  5.   </p>  
  6.   <aside>  
  7.     The movie earned $87 million during its initial release.   
  8.   </aside>  
  9.   <p>  
  10.     More info about the movie...   
  11.   </p>  
  12. </article>  


<article>元素
Article元素(<article>)故名思议,能够表明论坛帖子、杂志或新闻文章内容、blog、客户递交的评价、互动式组件,或别的单独的內容新项目。它的关键词义为表明自身是1个单独的內容构造。每个<article>元素內部构造都应当是类似的,例如都应当包括1个头题目(h1-h6元素)等。

<article>元素用法:

    当<article>元素嵌套循环应用时,则该元素意味着与父元素相关的文章内容。比如,意味着blog评价的<article>元素可嵌套循环在意味着blog文章内容的<article>元素中。
    <article>元素汉语章作者的信息内容可根据<address>元素表明,可是不可用于嵌套循环的<article>元素。

    <article>元素汉语章的公布时间和時间可根据<time>元素的pubdate特性表明。

编码样例

XML/HTML Code拷贝內容到剪贴板
  1. <article class="film_review">  
  2.   <header>  
  3.     <h2>侏罗纪公园</h2>  
  4.   </header>  
  5.   <section class="main_review">  
  6.     <p>Dinos were great!</p>  
  7.   </section>  
  8.   <section class="user_reviews">  
  9.     <article class="user_review">  
  10.       <p>Way too scary for me.</p>  
  11.       <footer>  
  12.         <p>  
  13.           Posted on <time datetime="2015-05⑴6 19:00">May 16</time> by Lisa.   
  14.         </p>  
  15.       </footer>  
  16.     </article>  
  17.     <article class="user_review">  
  18.       <p>I agree, dinos are my favorite.</p>  
  19.       <footer>  
  20.         <p>  
  21.           Posted on <time datetime="2015-05⑴7 19:00">May 17</time> by Tom.   
  22.         </p>  
  23.       </footer>  
  24.     </article>  
  25.   </section>  
  26.   <footer>  
  27.     <p>  
  28.       Posted on <time datetime="2015-05⑴5 19:00">May 15</time> by Staff.   
  29.     </p>  
  30.   </footer>  
  31. </article>