Sections
<section>
The <section>
element
groups related content together, and typically each section would have its own
heading.
For example, on a homepage there may
be several <section> elements
to contain different sections of the page, such as latest news, top products,
and newsletter signup. Because the <section> element groups
related items together, it may contain several distinct <article>
elements
that have a common theme or purpose. Alternatively, if you have a page with a
long article, the <section> element can
be used to split the article up into separate sections.
The <section>
element
should not be used as a wrapper for the entire page (unless the page only
contains one distinct piece of content).
If you want a containing element for
the entire page, that job is still best left to the <div>
element.
Code example is as following!!!
<section
class="popular-recipes">
<h2>Popular Recipes</h2>
<a
href="">Yakitori (grilled chicken)</a>
<a
href="">Tsukune (minced chicken patties)</a>
<a href="">Okonomiyaki (savory pancakes)</a>
<a
href="">Mizutaki (chicken stew)</a>
</section>
<section
class="contact-details">
<h2>Contact</h2>
<p>Yoko's Kitchen<br />
27 Redchurch Street<br />
Shoreditch<br />
London E2 7DP</p>
</section>
