Text of CSS
Text Color
The color property is used to set the color of the text. The color can be set by:
- name – specify a color name, like “red”
- RGB – specify an RGB value, like “rgb(255,0,0)”
- Hex – specify a hex value, like “#ff0000″
The default color for a page is defined in the body selector.
Example
|
Text Alignment
The text-align property is used to set the horizontal alignment of a text.
Text can be centered, or aligned to the left or right, or justified.
When text-align 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
|
Text Decoration
The text-decoration property is used to set or remove decorations from text.
The text-decoration property is mostly used to remove underlines from links for design purposes:
Example
|
It can also be used to decorate text:
Example
|
It is not recommended to underline text that is not a link, as this often confuse users.
Text Transformation
The text-transform property is used to specify uppercase and lowercase letters in a text.
It can be used to turn everything into uppercase or lowercase letters, or capitalize the first letter of each word.
Example
|
Text Indentation
The text-indentation property is used to specify the indentation of the first line of a text.
Example
|
All CSS Text Properties
The number in the “CSS” column indicates in which CSS version the property is defined (CSS1 or CSS2).
| Property | Description | Values | CSS |
|---|---|---|---|
| color | Sets the color of a text | color | 1 |
| direction | Sets the text direction | ltr rtl |
2 |
| line-height | Sets the distance between lines | normal number length % |
1 |
| letter-spacing | Increase or decrease the space between characters | normal length |
1 |
| text-align | Aligns the text in an element | left right center justify |
1 |
| text-decoration | Adds decoration to text | none underline overline line-through blink |
1 |
| text-indent | Indents the first line of text in an element | length % |
1 |
| text-shadow | none color length |
||
| text-transform | Controls the letters in an element | none capitalize uppercase lowercase |
1 |
| unicode-bidi | normal embed bidi-override |
2 | |
| vertical-align | Sets the vertical alignment of an element | baseline sub super top text-top middle bottom text-bottom length % |
1 |
| white-space | Sets how white space inside an element is handled | normal pre nowrap |
1 |
| word-spacing | Increase or decrease the space between words | normal length |
1 |
