CSS Text Styling
CSS (Cascading Style Sheets) is a language used to style HTML documents. One of the main features of CSS is its ability to manipulate the appearance of text in HTML pages.
Here are some CSS properties used for text styling:
The font-family
This property is used to specify the font used for text. You can use either a specific font name, or a generic font family like "serif"
or "sans-serif"
.
As an example:
p {
font-family: Arial, sans-serif;
}
The font-size
This property sets the size of the font used for text. You can use units like pixels
, ems
or percentages
.
As an example:
p {
font-size: 16px;
}
The font-style
This property is used to make text italic
or oblique
.
As an example:
em {
font-style: italic;
}
The font-weight
This property is used to make text bold
.
As an example:
strong {
font-weight: bold;
}
The text-align
This property is used to specify the alignment of text within its container.
As an example:
h1 {
text-align: center;
}
The text-decoration
This property is used to add underline
, overline
, line-through
or blink
effects to text.
As an example:
a {
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
The text-transform
This property is used to change the case of text. You can use values like "uppercase"
, "lowercase"
or "capitalize"
.
As an example:
h2 {
text-transform: uppercase;
}
The line-height
This property sets the height of a line of text. It can be used to increase or decrease the spacing between lines of text.
As an example:
p {
line-height: 1.5;
}
The letter-spacing
This property is used to increase or decrease the spacing between characters in text.
As an example:
h3 {
letter-spacing: 2px;
}
The word-spacing
This property is used to increase or decrease the spacing between words in text.
As an example:
p {
word-spacing: 4px;
}