HTML and CSS Reference
In-Depth Information
In Practice
It's time to take Styles Conference from a single-page website to a full-blown website with
multiple pages, all of which will be linked together using hyperlinks.
1.
We'll begin by making our “Styles Conference” text inside the
<h1>
element
within our
<header>
element link to the
index.html
page.
Because we are already on the
index.html
page, this may seem a little
odd—and rightfully so—but as the header is replicated on other pages, linking
back to the home page will make sense.
1.
<h1>
2.
<a href="index.html">
Styles Conference
</a>
3.
</h1>
2.
In order to navigate across all of the different pages, we're going add in a naviga-
tion menu, using the
<nav>
element, within our
<header>
element. We'll be
creating Speakers, Schedule, Venue, and Register pages to go with our home page,
so we should create links for all of them.
1.
<header>
2.
3.
...
4.
5.
<nav>
6.
<a href="index.html">Home</a>
7.
<a href="speakers.html">Speakers</a>
8.
<a href="schedule.html">Schedule</a>
9.
<a href="venue.html">Venue</a>
10.
<a href="register.html">Register</a>
11.
</nav>
12.
13.
</header>
3.
Let's also add the same navigation menu from our
<header>
element to our
<footer>
element for convenience.
1.
<footer>
2.
3.
...
4.
5.
<nav>
6.
<a href="index.html">Home</a>
Search WWH ::
Custom Search