Description: & lt; aside & gt; elements and & lt; article & gt; Elements in HTML5, html5aside

Source: Internet
Author: User

The <aside> elements and <article> elements in html5.

<Aside> Elements
The HTML <aside> element indicates a part of a page. Its content is not correlated with other content on the page, or is not associated and exists independently. The <aside> element is usually displayed as a sidebar or some inserted supplementary content. It is usually used to display some definitions on the sidebar, such as directories, indexes, and glossary. It can also be used to display related advertisement, author's introduction, Web applications, and links, the content of the current page.

<Aside> element usage considerations:

Do not use the <aside> element to mark the text in parentheses, because this type of text is considered part of the main content.

Example:

Copy XML/HTML Code to clipboard
  1. <Article>
  2. <P>
  3. The Disney movie <em> The Little Mermaid </em> was
  4. First released to theaters 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> element
An alias for an Article element (<article>) indicates a forum post, magazine or news Article, blog, comments submitted by users, interactive components, or other independent content items. Its main syntax is to express itself as an independent content structure. The internal structure of each <article> element should be similar, such as containing a header (h1-h6 element.

<Article> element usage:

When the <article> element is nested for use, the element represents an article related to the parent element. For example, the <article> element representing a blog comment can be nested in the <article> element representing a blog article.
The information of the author in the <article> element can be expressed by the <address> element, but it is not applicable to nested <article> elements.

The publishing date and time of an article in the <article> element can be expressed by the pubdate attribute of the <time> element.

Sample Code

Copy XML/HTML Code to clipboard
  1. <Article class = "film_review">
  2. <Header>
  3. <H2> Jurassic Park
  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 = ""> 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 = ""> May 17 </time> by Tom.
  22. </P>
  23. </Footer>
  24. </Article>
  25. </Section>
  26. <Footer>
  27. <P>
  28. Posted on <time datetime = ""> May 15 </time> by Staff.
  29. </P>
  30. </Footer>
  31. </Article>

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.