79
433 HTML5 LAYOUT
<header>
<h1>Yoko's Kitchen</h1>
<nav>
<ul>
<li><a href="" class="current">home</a></li>
<li><a href="">classes</a></li>
<li><a href="">catering</a></li>
<li><a href="">about</a></li>
<li><a href="">contact</a></li>
</ul>
</nav>
</header>
chapter-17/example.html
HTML
The
<header>
and
<footer>
elements can be used for:
The main header or footer
●
that appears at the top or
bottom of every page on the
site.
A header or footer for an
●
individual
<article>
or
<section>
within the page.
In this example, the
<header>
element used to contain the site
name and the main navigation.
The
<footer>
element contains
copyright information, along
with links to the privacy policy
and terms and conditions.
Each individual
<article>
and
<section>
element can also
have its own
<header>
and
<footer>
elements to hold the
header or footer information for
that section within the page.
For example, on a page with
several blog posts, each
individual post can be thought
of as a separate section. The
<header>
element can therefore
be used to contain the title and
date of each individual post, and
the
<footer>
might contain
links to share the article on
social networking sites.
Please note that all of the
code shown in this chapter
is referenced in one HTML
document which is called:
html5-layout.html
Headers & FooTers
<header> <footer>
<footer>
© 2011 Yoko's Kitchen
</footer>
chapter-17/example.html
HTML