Home / Articles / Programming languages / Markup languages / HTML & CSS / HTML5: elements article and section

HTML5: elements article and section

HTML5: elements article and section
 
Authors: Daisy Smith
HTML5: elements article and section
  • Currently 0 out of 5 Stars.
  • 1
  • 2
  • 3
  • 4
  • 5
Rating: 0/5 (0 votes cast)

Thank you for rating!

You have already rated this page, you can only rate it once!

Your rating has been changed, thanks for rating!

Log in or create a user account to rate this page.


If you don't know which element to use, keep in mind their value and semantics.

Element article

This element is used with a particular content. But what does "particular" exactly mean? - The content that exists independently from the rest of the information. For example forum and blog messages, comments, news articles.

<article>
  <h2>What is CSS</h2>
  <p>CSS (Cascading Style Sheets) a language which describes the outer appearance of a document, created with the help of markup language.</p>
</article>
<article>
  <h2>CSS and HTML</h2>
  <p>Your document must have a valid HTML-code to achieve better results when using CSS</p>
</article>

Element section

This element is one of the main elements among the new ones, often contains header and footer, and is similar to div. But that's not all. If you want to use the element section correctly, add a header to it by using tags h1-h6.

<section>
  <h1>Basic knowledge</h1>
  <article>
    <h2>What is CSS</h2>
    <p> CSS (Cascading Style Sheets) - a language which describes the outer appearance of a document, created with the help of markup language.</p>
  </article>
  <article>
    <h2>CSS and HTML</h2>
    <p>Your document must have valid HTML-code to achieve better results when using CSS</p>
  </article>
</section>

When you don't need to use section:

  • If you need only to set the styles - use div instead of section;
  • do not use section, if it is better for the content to use header, footer, or aside;
  • If the text doesn't have a header, element section is not used.

 

Read also

HTML5: adding new elements

HTML5: adding new elements

Discussion (total 2 comments)

Rene van der Lende
November 21, 2014 at 07:38 pm
Hi Daisy,

After reading this page (http://www.w3.org/wiki/HTML_structural_elements) you may find your article to be no longer correct. In fact, WC3 advices to use the proper <tags> and use <div> "when there is no other more suitable element available for grouping an area of content."
WC3 also has a quite different view on usage of those <tags>, which puts your explanation in a less than desirable perspective.

No rant, just FYI!
Cheers, Rene
SUBRATA MIDYA
September 06, 2016 at 06:45 am
help

Post comment

basicuse.net
html5_css
106160485398655174790

Quick navigation

General navigation