Alignment
Text-based content (e.g., newspapers or blogs), may align its text in certain ways to make it more readable and user-friendly.
In CSS, we can horizontally align our text the same way with the text-align
property!
Three common ways to align text are: to the left (this is the default), in the center, or to the right:
#left-align {
text-align: left;
}
#center-align {
text-align: center;
}
#right-align {
text-align: right;
}
This is what the rendered result looks like:
Decoration
In the image from the last section, did you notice how the text at the top was underlined? How did that happen?!
Another well-known property for text-formatting is the text-decoration
property!
For example, to underline the text “I love CSS!” in a <p>
paragraph element:
p {
text-decoration: underline;
}
The rendered result would look something like this: