Alongside the several
font-* properties, CSS provides many
text-align property must be applied on a block-level element and defines how its text and children inline elements are horizontally aligned.
The most used values are:
These values correspond to the same alignment buttons you find in Microsoft Word or Photohop:
justify value is not recommended. Although it might look visually appealing because it forms a rectangle of text, it is very hard to read.
text-align default value is
start can either be
right, depending on the direction set on the HTML document.
direction is a CSS property that can either be
ltr (left to right) or
rtl (right to left):
text-decoration property is used to add a line on your text.
By default, HTML links (
<a>) have a
text-decoration: underline; applied to them. One of the first things coders usually do is to remove this default styling:
text-indent property allows to add space before the first letter of the first line of a block-level element.
People always make the mistake of thinking art is created for them. But really, art is a private language for sophisticates to congratulate themselves on their superiority to the rest of the world. As my artist’s statement explains, my work is utterly incomprehensible and is therefore full of deep significance.
Notice how only the first line is indented. If you want to offset the whole block of text, use paddings.
As for the
font-size property, you can use
em, or even
If you’ve ever used Photoshop, you’ve probably used the drop shadow tool. In CSS, you can add shadow to a text, to make it either fancier or more readable.
xthe horizontal offset
ythe vertical offset
y values are required. The
blur defaults to
0 (zero), while the
color defaults to the color of the text.
This property is tricky, so use it with parsimony and don’t go crazy!