HTML and CSS Reference
In-Depth Information
.
Output
FIGURE 7.16
The About the
Bookworm
Bookshop section.
Creating the Recent Titles Section
The Recent Titles section is a classic link
menu, as described earlier in this section. Here you can put the list of titles in an
unordered list, with the titles as citations, by using the
<cite>
tag. End the section with
another horizontal rule.
After the Recent Titles heading (shown in the first line in the following example), enter
the following code:
<a name=”recent”><h2>
Recent Titles (as of 11-Jan-2010)
</h2></a>
<ul>
<li>
Sandra Bellweather,
<cite>
Belladonna
</cite></li>
<li>
Jonathan Tin,
<cite>
20-Minute Meals for One
</cite></li>
<li>
Maxwell Burgess,
<cite>
Legion of Thunder
</cite></li>
<li>
Alison Caine,
<cite>
Banquo's Ghost
</cite></li>
</ul>
<hr />
Now add the anchor tags to create the links. How far should the link extend? Should it
include the whole line (author and title) or just the title of the topic? This decision is a
matter of preference, but I like to link only as much as necessary to make sure that the
link stands out from the text. I prefer this approach to overwhelming the text. Here, I
linked only the titles of the topics. At the same time, I also added links to the table of
contents and the top of the page:
Input
▼
<a name=”recent”><h2>
Recent Titles (as of 11-Jan-2010)
</h2></a>
<ul>
<li>
Sandra Bellweather,
<a href=”belladonna.html”>
<cite>
Belladonna
</cite></a></li>
<li>
Johnathan Tin,
<a href=”20minmeals.html”>
<cite>
20-Minute Meals for One
</cite></a></li>
<li>
Maxwell Burgess,
<a href=”legion.html”>
<cite>
Legion of Thunder
</cite></a></li>
<li>
Alison Caine,
<a href=”banquo.html”>
<cite>
Banquo's Ghost
</cite></a></li>
</ul>
7
