Styling the <h1> Element
The <h1> element will be styled very simply with border-bottom and margin-bottom as shown in Listing 20.10 and Figure 20.2.
Listing 20.10. CSS Code for Styling the <h1> Element
body
{
font: 100% georgia, times, serif;
background: #fff;
color: #000;
}
h1
{
border-bottom: 1px solid #999;
margin-bottom: 1em;
}
 | In traditional typesetting, an em space is defined as the width of an uppercase M in the current face and point size. An em dash is the width of a capital M, an en dash is half the width of a capital M, and an em quad (a unit of spacing material typically used for paragraph indentation) is the square of a capital M. |
In CSS, an em is a relative measure of length that inherits size information from parent elements. If the parent element is the <body>, the size of the element is actually determined by the user's browser font settings. So in most browsers, where the default font size is 16px, 1em will be 16px.
|
| Some website content has no purpose on a printed page, such as site-based navigation or some advertising. |
These areas of content can be hidden from the printer using display: none;.
When this declaration is applied to an element, the elements and all descendants will not be displayed. You cannot override this behavior by setting a different display property on the descendant elements.
|
|
