Heading

Text properties:

text.spacing
text.transform
text.underline
text.strikethrough
text.overline
text.color
text.background

Text spacing causes letters within a word to be `spaced out'. The normal inter-letter spaces are multiplied by the given factor. The factor can be given as a decimal or as a percentage: `%' simply means `times 0.01'. Note that spacing is different from justifying a line (which only changes spaces between words) and expansion (which stretches the letters themselves).

Text transformation can change upper case into lower case and vice versa, provided the characters have an upper/lower case equivalent. (The application will have a mapping table built in). Note that text transformation is different from selecting a `small-caps' style for text.style, although a font transformation and a size change together may occasionally serve as a poor man's small-caps if a real small-caps font is not available.

Underlines, overlines and strike-through lines are applied to letters and also to spaces between words, even when those spaces are stretched as a result of line justification. Spaces that are the result of tabs (<TAB> in HTML) do not get lines. The visually best position of the lines can often be found in the meta-information of a font. If the font has no such parameters, the application should use some heuristics.

The background color can have the special value `none', to indicate that the background of the window itself is used. `None' effectively means `transparent'. This is different from no value at all, since in that case the property is inherited and the parent's background color need not be transparent.

The area that is colored by the background color depends on other properties of the element. If the element is block-like (i.e, it has both a line break before and after it), the color will fill a rectangle that includes the whitespace around the element. Otherwise only the background behind letters and spaces is filled and margins and tabs are left to an ancestor element. See below for the precise filling rules when the element is block-like

The text-align property is used to set the horizontal alignment of a text.A text can be left or right aligned, centered, or justified.

The following example shows center aligned, and left and right aligned text (left alignment is default if text direction is left-to-right, and right alignment is default if text direction is right-to-left):
Example
h1 {
text-align: center;
}

h2 {
text-align: left;
}

h3 {
text-align: right;
}

When the text-align property is set to "justify", each line is stretched so that every line has equal width, and the left and right margins are straight (like in magazines and newspapers):
Example
div {
text-align: justify;
}

The direction and unicode-bidi properties can be used to change the text direction of an element:
Example
p {
direction: rtl;
unicode-bidi: bidi-override;
}

The text-decoration property is used to set or remove decorations from text.

The value text-decoration: none; is often used to remove underlines from links:
Example
a {
text-decoration: none;
}

The other text-decoration values are used to decorate text:
Example
h1 {
text-decoration: overline;
}

h2 {
text-decoration: line-through;
}

h3 {
text-decoration: underline;
}

In CSS, we use the font-family property to specify the font of a text.

The font-family property should hold several font names as a "fallback" system, to ensure maximum compatibility between browsers/operating systems. Start with the font you want, and end with a generic family (to let the browser pick a similar font in the generic family, if no other fonts are available). The font names should be separated with comma.

Note: If the font name is more than one word, it must be in quotation marks, like: "Times New Roman".