CSS Text

The text is styled with some of the text formatting properties.The heading uses the text-align,text-transform, and color properties.

The paragraph is indented, aligned, and the space between characters is specified.

Text Color

The color property is used to set the color of the text.

Example

body {
color: blue;
}

h1 {
color: red;
}

Text Alignment

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.

Example

h1 {
text-align: center;
}
h2 {
text-align: left;
}
h3 {
text-align: right;
}

Text Decoration

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

The text-decoration: none; is often used to remove underlines from links.

Example

a {
text-decoration: none;
}
h1 {
text-decoration: overline;
}
h2 {
text-align: line-through;
}
h3 {
text-align: underline;
}

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

p.uppercase {
text-transform: uppercase;
}
p.lowercase {
text-transform: lowercase;
}
h2 {
text-transform: capitalize;
}

Text Indent

The text-indent property is used to specify the indentation of the first line of a text.

Example

p {
text-indent: 100px;
}

Letter Spacing

The letter-spacing property is used to specify the space between the characters in a text.

Example

h1 {
letter-spacing: 5px;
}
h2 {
letter-spacing: -2px;
}

---

Line Height

The line-height property is used to specify the space between lines.

Example

p.small {
line-height: 0.7;
}
p.big {
line-height: 2.0;
}

Word Spacing

The word-spacing property is used to specify the space between the words in a text.

Example

h1 {
word-spacing: 10px;
}
h2 {
word-spacing: -5px;
}

---