HTML and CSS Reference
In-Depth Information
SELECTING THE FIRST AND LAST ELEMENT
Styling the first element of any set
differently is common on the web
today. This blog renders the first
paragraph in a larger font to make
it stand out.
The old way to approach this was
to explicitly add a class to the first
paragraph:
<h1>Heading</h1>
<p class="first">
First paragraph...
</p>
This blog goes even further—the
first post is styled differently than
the other posts previewed on the
home page. The first post takes
up the full width and is divided
into columns; the rest of the posts
are in a single column further
down. Again, the usual approach
to this is to add a class in the
markup:
<div class="post first">
<h1>Post 1</h1>
<p>...
</div>
<div class="post">
<h1>Post 2...
For details on
CSS
columns,
check out chapter 11.
