CSS Text - Detailed Overview

Introduction to CSS Text Properties

The CSS text properties allow you to control the appearance of text on a web page. This includes font properties, text alignment, text decoration, and more.

Font Family

The font-family property specifies the typeface to be used for text. For example:

p {
    font-family: 'Arial', sans-serif;
}

This paragraph uses the Arial font.

Font Size

The font-size property specifies the size of the font. For example:

p {
    font-size: 20px;
}

This text is 20px in size.

Text Alignment

The text-align property specifies the horizontal alignment of text. For example:

p {
    text-align: center;
}

This text is centered.

Text Decoration

The text-decoration property is used to set decoration on text, such as underline, overline, and line-through. For example:

a {
    text-decoration: underline;
}
This link is underlined.

Text Transform

The text-transform property controls the capitalization of text. For example:

p {
    text-transform: uppercase;
}

This text is uppercase.

Line Height

The line-height property sets the amount of space between lines of text. For example:

p {
    line-height: 1.5;
}

This text has a line height of 1.5.

Letter Spacing

The letter-spacing property controls the space between characters in text. For example:

p {
    letter-spacing: 2px;
}

This text has 2px of letter spacing.

Word Spacing

The word-spacing property controls the space between words. For example:

p {
    word-spacing: 4px;
}

This text has 4px of word spacing.

Text Shadow

The text-shadow property adds shadow effects to text. For example:

p {
    text-shadow: 2px 2px 4px #aaa;
}

This text has a shadow effect.