Here they are, broken into sections with my comments between
each section.
* {
margin:0;
padding:0;
}
body {
font: 1em Lucida, Arial, sans-serif;
}
h1, h2, h3, h4, h5, h6, ul, ol, dl {
font-family: 'Trebuchet MS', Arial, serif;
}
I start by setting all the elements??™ margins to zero, set one font family
for all the elements, and then set a second font family for headings
and lists. Next, I deal with the heading sizes:
h1 {font-size:2em;
}
h2 {font-size:1.5em;
line-height:1.25;
padding: 0 0 0 0;
}
h3 {font-size:1.25em;
line-height:1.5;
}
h4 {font-size:1.125em;
}
h5 {font-size:1em;
}
h6 {font-size:.875em;
}
BUILDING WEB PAGES 245
This resets the relative sizes of the headings. The default browser
style sheet sizes for the large headings are too big, and the difference
between the largest and smallest heading is extreme. My styles
above make the smaller heading larger to produce a tighter range of
heading sizes??”even the smallest one now is bigger than the paragraph
size. It doesn??™t make sense to me for headings to be smaller
than regular text. Next, I set some basic styles for the most commonly
used XHTML elements.
p {font-size:1em;}
code {font-size:1.25em;}
* html code {font-size:1.1em;}
cite {
font-size:.85em;
font-style:italic;
}
blockquote {
width:30%;
font-size:.7em;
margin:0 0 1em 1em;
padding:.
Pages:
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288