Advanced CSS

Text Properties

There are many CSS properties to use in your style sheets. Here are the text properties and how to use them.

Text Properties

word-spacing - defines the amount of space between the words.

• word-spacing : normal;
  make the word spacing the normal for this font.
• word-spacing : +15mm;
  Add 15mm of space between words.

Specify the length as you would the height of your font with ems, pixels, picas, points, inches, centimeters, or milimeters.

letter-spacing - defines the amount of space between each letter. This is usually called tracking in print design.

• letter-spacing : normal;
  make the tracking normal for this font.
• letter-spacing : +1mm;
  Add 1mm between each letter.
• letter-spacing : -1px;
  Reduce the tracking by 1 pixel between each letter.

Specify the length as you would the height of your font with ems, pixels, picas, points, inches, centimeters, or milimeters.

text-decoration - defines the decoration of the text.

• text-decoration : none;
  Remove all decorations on the text. (Used on <a> tags to remove the underline.)
• text-decoration : overline;
  Put a line above the text.
• text-decoration : underline;
  Put a line below the text.
• text-decoration : line-through;
  Put a line through the midline of the text.
• text-decoration : blink;
  Make the text blink on and off. (Not supported in browsers other than Netscape derivatives.)

text-transformation - defines the case of the text.

• text-transform : capitalize;
  Make the first letter of each word uppercase.
• text-transform : uppercase;
  Make each letter uppercase.
• text-transform : lowercase;
  Make each letter lowercase.
• text-transform : none;
  Remove all transformation from the text.

text-align - defines how the text will be aligned on the page.

• text-align : left;
• text-align : right;
• text-align : center;
• text-align : justify;
  Align the text so that it is flush with both sides of the document.

text-indent defines how much the first line of the text should be indented.

• text-indent : 15mm;
• text-indent : 5%;

Specify the length as you would the height of your font with ems, pixels, picas, points, inches, centimeters, or milimeters.

line-height defines the amount of space between lines of text. This is usually called leading in print design.

• line-height : 1.5;
  Without a unit, the number is assumed to be multiplied by the standard line height for this font.
• line-height : 5mm;
• line-height : 10%;

There are many more styles, but hopefully, these will get you started using style sheets.

First page > Taking Styles Further > Page 1, 2, 3

Previous Features