HTML and CSS Reference
In-Depth Information
If you view this in your browser, it makes sense semantically (see Figure
7-3
). This should be a secondary goal for
the app: if all the styles are ripped away, is it still legible?
Figure 7-3.
The unstyled header markup
The Footer Markup
Similar to the header, the footer is semantically simple. It breaks down to a box with legal copy and a couple of links.
Because copy like that makes sense in a list, let's use an unordered list to display it inside the
<footer>
element. Add
the code in bold to the body of
index.html
:
<body>
<header>
<h1>Realtime Q&A</h1>
<p class="tagline">
A live feedback system for classes, presentations, and conferences.
</p><!--/.tagline-->
</header>
<footer>
<ul>
<li class="copyright">
© 2013 Jason Lengstorf & Phil Leggetter
</li><!--/.copyright-->
<li>
Part of <em>Realtime Web Apps: HTML5 Websockets, Pusher, and the
Web’s Next Big Thing</em>.
</li>
<li>
<a href="
http://amzn.to/XKcBbG">Get
the Book</a> |
<a href="
http://cptr.me/UkMSmn">Source
Code (on GitHub)</a>
</li>
Search WWH ::
Custom Search