HTML and CSS Reference
In-Depth Information
<section />
The
<section />
element can be used to define a section within an HTML5
document. You can use the
<section />
tag to group together common
elements, such as chapters for a blog post or product information for an
ecommerce web site. A common misconception is to replace all
<div />
elements with
<section />
elements. If you are using
<section />
elements to
help with styling or scripting and not for creating a semantic document, you
should probably use a
<div />
with a class.
Listing 3-21 shows how to use a
<section />
element to group together
comments on a blog post.
Listing 3-21.
Using a Section Element in HTML5
<article>
<header>
<h1>Article Title</h1>
<p>
Created by Daniel Carpenter on
<time pubdate="2012-03-15">March 15<sup>th</sup> 2012</time>
</p>
</header>
<p>Article Content</p>
<section class="comments">
<article id="comment-1">
<header>
<p>
From Becci Buckley on
<time pubdate="2012-03-15">March 20<sup>th</sup> 2012</time>
</p>
</header>
<p>This is a great article Dan, it might need some work :D</p>
</article>
</section>
