HTML and CSS Reference
In-Depth Information
6.
7.
body {
8.
color: #888;
9.
font: 300 16px/22px "Open Sans", "Helvetica Neue", Helvetica,
Arial, sans-serif;
10.
}
2.
In
Lesson 4
,
“
Opening the Box Model
,” we began adding some typographic styles,
specifically adding a bottom
margin
to a few different levels of headings and
paragraphs. Within the same section of the
main.css
file, let's add a color to the
level-one through level-four headings.
1.
h1, h2, h3, h4 {
2.
color: #648880;
3.
}
While we're at it, let's also add in font sizes for these different heading levels. Our
<h1>
and
<h2>
elements will use fairly large
font-size
values; consequently,
we'll also want to increase their
line-height
values to keep the text within
these elements legible. For reference, we'll make their
line-height
values 44
pixels, double the value of the base
line-height
set within the
<body>
ele-
ment rule set.
1.
h1 {
2.
font-size: 36px;
3.
line-height: 44px;
4.
}
5.
h2 {
6.
font-size: 24px;
7.
line-height: 44px;
8.
}
9.
h3 {
10.
font-size: 21px;
11.
}
12.
h4 {
13.
font-size: 18px;
14.
}
3.
Our
<h5>
elements are going to be a little more unique than the rest of our head-
ings. Accordingly, we're going to change their styles a bit.
We'll use a different
color
property value and a slightly smaller
font-size
for these elements, and we're going to change the
font-weight
to
400
, or
normal
.
Search WWH ::
Custom Search