CSS: CSS Font and CSS Text Styles

Chapter 5 part 2 (of 2)

You've probably already run into the text-indent and line-height properties in this tutorial. (text-indent is the indentation at the beginning of an element, such as a p, and line-height is the space a line occupies, including text and the white-space above it.)

You can also use the properties letter-spacing and word-spacing, which should be somewhat self-explanatory. Common units for values of either of these properties are px or em. (E.g. 2px)

Dave has a New Course for your iPad!
Download HTML and CSS Web Design Basics Right Now! Or Search for "Web Design Basics" in AppStore!

The text-align property comes in handy frequently. You can set this to left, center, right, or justify. The first three act exactly like they sound. justify just inherits its alignment from the element around it.

You can do a few cool things with the text-transform property. You can set it to capitalize (first letter in each word), uppercase (all letters), lowercase (all letters), or none (no special transformation).

Last but not least of the text styles is the text-decoration property. This is one of the most widely used properties, and you'll see why in the next chapter on links. The values for text-decoration are none (regular text), underline, overline, line-through, and blink.

Ready to test your skills? Make an element-less class that has a large spacing between letters in words that are all uppercase by a transformation. Also, make them underlined and monospace.

Click here if you get stuck or want to see how I did it.

< Ch. 5 part 1 > continue to Chapter 6

Our Hosting Partners:

iPage Hosting $4.25/mo
Yahoo! Hosting $7.46/mo
1&1 Hosting $6.99/mo
GreenGeeks $6.95/mo
Globat $4.44/mo

Free Domain Name If you Order Today!

CSS - Cascading Style Sheets

An Interactive How To Code CSS Tutorial for Beginners

davesite.com / webstation / css other topics: html / web site design / JavaScript / Internet 101

Our CSS Style topics:

CSS: CSS Font and CSS Text Styles