In this lesson, we cavorted in the land of fonts: font faces, sizes, boldness, italics, capitalization, underlining, and so on. Sure, you can do a lot of these things with traditional HTML tags — but not all of them, and certainly not with the level of control that you can achieve through stylesheets.
The cascading stylesheets properties now in our arsenal follow:
- font-family defines which font will display.
- font-size lets you control text size using points, pixels, keywords, and other units.
- font-style designates italics.
- font-weight provides complete control over all the levels of boldness available.
- font-variant rules small caps.
- text-transform controls capitalization.
- text-decoration is the miscellaneous text property in charge of underlining, blink, and so on.
We need to mention one more property here: font. The font property is a kind of shorthand for a few of the other properties. It's a way of assigning font-size, line-height, and font-family all at once. Here's an example:
LI { font: 12pt/16pt courier }
This one rule defines <LI> text as 12 points in size, 16 points in line height (we'll talk about this property in Lesson 3), and in the Courier typeface.
If you use font, you must always set the font size and font face, but the line height is optional. Make sure the values are in the exact order you see above.
This is just the beginning of our exploration of the many CSS properties. Check out Lesson 3, where we expand on these font properties and look at typography and layout.
