Text Styles

The guide to create your Web site on Internet

text-indent

This property specifies the indentation of the first line of text in a block. More precisely, it specifies the indentation of the first box that flows into the block's first line box. The box is indented with respect to the left (or right, for right-to-left layout) edge of the line box. User agents should render this indentation as blank space.

Property

Value:	length \| percentage \| inherit lenght : em , ex , px percentage : %
Initial:	0
Applies to:	block-level elements , table cells and inline blocks
Inherited:	yes
Percentages:	refer to width of containing block
Media:	visual
Computed value:	the percentage as specified or the absolute length

Examples

text-indent: 0em;	=>	Example text
text-indent: 3em;	=>	Example text
text-indent: 5em;	=>	Example text

text-align

This property describes how inline content of a block is aligned.

Property

Value:	left \| right \| center \| justify \| inherit
Initial:	'left' if 'direction' is 'ltr'; 'right' if 'direction' is 'rtl'
Applies to:	block-level elements, table cells and inline blocks
Inherited:	yes
Percentages:	N/A
Media:	visual
Computed value:	as specified

Examples

text-align: left;	=>	Example text
text-align: center;	=>	Example text
text-align: right;	=>	Example text

text-decoration

This property describes decorations that are added to the text of an element using the element's color. When specified on an inline element, it affects all the boxes generated by that element; for all other elements, the decorations are propagated to an anonymous inline box that wraps all the in-flow inline children of the element, and to any block-level in-flow descendants. It is not, however, further propagated to floating and absolutely positioned descendants, nor to the contents of 'inline-table' and 'inline-block' descendants.

Property

Value:	none \| [ underline \|\| overline \|\| line-through \|\| blink ] \| inherit
Initial:	none
Applies to:	all elements
Inherited:	no
Percentages:	N/A
Media:	visual
Computed value:	as specified

Examples

text-decoration: underline;	=>	Example text
text-decoration: overline;	=>	Example text
text-decoration: line-through;	=>	Example text
text-decoration: blink;	=>	Example text

letter-spacing

This property specifies spacing behavior between text characters.

Property

Value:	normal \| length \| inherit
Initial:	normal
Applies to:	all elements
Inherited:	yes
Percentages:	N/A
Media:	visual
Computed value:	normal or absolute length

Examples

letter-spacing: 0cm;	=>	Example text
letter-spacing: 0.1cm;	=>	Example text
letter-spacing: 0.2cm;	=>	Example text

word-spacing

This property specifies spacing behavior between words.

Property

Value:	normal \| length \| inherit
Initial:	normal
Applies to:	all elements
Inherited:	yes
Percentages:	N/A
Media:	visual
Computed value:	for 'normal' the value '0'; otherwise the absolute length

Examples

word-spacing: 0em;	=>	Example text
word-spacing: 1em;	=>	Example text

text-transform

This property controls capitalization effects of an element's text.

Property

Value:	capitalize \| uppercase \| lowercase \| none \| inherit
Initial:	none
Applies to:	all elements
Inherited:	yes
Percentages:	N/A
Media:	visual
Computed value:	as specified

Examples

text-transform: none;	=>	Example text
text-transform: capitalize;	=>	Example text
text-transform: uppercase;	=>	Example text
text-transform: lowercase;	=>	Example text

white-space

This property declares how whitespace inside the element is handled.

Property

Value:	normal \| pre \| nowrap \| pre-wrap \| pre-line \| inherit normal : This value directs user agents to collapse sequences of whitespace, and break lines as necessary to fill line boxes. pre : This value prevents user agents from collapsing sequences of whitespace. Lines are only broken at newlines in the source, or at occurrences of "\A" in generated content. nowrap : This value collapses whitespace as for 'normal', but suppresses line breaks within text. pre-wrap : This value prevents user agents from collapsing sequences of whitespace. Lines are broken at newlines in the source, at occurrences of "\A" in generated content, and as necessary to fill line boxes. pre-line : This value directs user agents to collapse sequences of whitespace. Lines are broken at newlines in the source, at occurrences of "\A" in generated content, and as necessary to fill line boxes.
Initial:	normal
Applies to:	all elements
Inherited:	yes
Percentages:	N/A
Media:	visual
Computed value:	as specified

Examples

white-space: pre-line;

Example text

For complete reference see CSS Style reference at W3C
B0..1 B1..1 B1..2 B2..1 B3..1 B4..1 B4..2 B4..3 B4..4 B5..1 B6..1 B7..1 B8..1 B8..2
B9..1 BA..1 BA..2 BA..3 BA..4 BA..5 BA..6 BA..7 BA..8 BA..9 BA..10 BA..11 BA..12 BA..13
BA..14 BA..15 BA..16 BA..17 BB..1 BB..2 BB..3 BC..1 BC..2 BC..3 BC..4 BC..5 BC..6 BC..7
BC..8 BC..9 BC..10 BC..11 BC..12 BC..13 BC..14 BC..15 BC..16 BC..17 BC..18 BC..19 BC..20 BC..21
BC..22 BC..23 BD..1 BD..2 BD..3 BD..4 BD..5 BD..6 BD..7 BD..8 BD..9 BD..10 BD..11 BD..12
BD..13 BE..1 BF..1 BF..2 BF..3 BF..4 BF..5 BF..6 BF..7 BF..8 BG..1 BG..2 BH..1 BI..1
BJ..1 BK..1 BL..1 BL..2 BL..3 BL..4 BL..5 BL..6 BM..1 BN..1 BO..1 BP..1 BP..2 BP..3
BQ..1 BQ..2 BQ..3 BQ..4 BQ..5 BQ..6 BR..1 BR..2 BR..3 BR..4 BR..5 BS..1 BS..2 BS..3
BS..4 BS..5 BS..6 BS..7 BS..8 BS..9 BS..10 BT..1 BT..2 BT..3 BT..4 BT..5 BT..6 BT..7
BT..8 BT..9 BT..10 BT..11 BU..1 BU..2 BU..3 BU..4 BU..5 BU..6 BU..7 BU..8 BU..9 BU..10
BU..11 BU..12 BU..13 BU..14 BU..15 BV..1 BW..1 BX..1 BX..2 BX..3 BY..1 BY..2 BY..3 BY..4
BY..5 BY..6 BY..7 BY..8 BY..9 BY..10 BY..11 BY..12 BZ..1 BZ..2 BZ..3 BZ..4 BZ..5 BZ..6
BZ..7 BZ..8 BZ..9 BZ..10 BZ..11 BZ..12 BZ..13 BZ..14 BZ..15 BZ..16 BZ..17 BZ..18 BZ..19 BZ..20
BZ..21 BZ..22 BZ..23 BZ..24 BZ..25 BZ..26 BZ..27 BZ..28 BZ..29 BZ..30 BZ..31 BZ..32 BZ..33 BZ..34