HTML and CSS Reference
In-Depth Information
1.
<section class="row-alt">
2.
<div class="container">
3.
4.
<h1>Speakers</h1>
5.
6.
<p>We’re happy to welcome over twenty speakers to present
on the industry’s latest technologies. Prepare for an
inspiration extravaganza.</p>
7.
8.
</div>
9.
</section>
4.
In addition to inserting the paragraph, let's also change some of the styles within
the lead section. To do this, we'll add a class of
lead
to the
<div>
element that
already has a class of
container
; this can be found nested directly inside the
<section>
element with a class of
row-alt
. Our lead section for each interior
page will now look like this:
1.
<section class="row-alt">
2.
<div class="
lead
container">
3.
4.
...
5.
6.
</div>
7.
</section>
5.
Once the
lead
class is in place, we'll center all of the text within these
<div>
elements. We'll also increase the
font-size
and
line-height
of any para-
graphs within these
<div>
elements.
We'll create a new section for leads within our
main.css
file, just below the ty-
pography section, and add the following styles:
1.
/*
2.
========================================
3.
Leads
4.
========================================
5.
*/
6.
7.
.lead {
8.
text-align: center;
9.
}
10.
.lead p {
11.
font-size: 21px;
Search WWH ::
Custom Search