HTML and CSS Reference
In-Depth Information
Adding style to your fonts
You're familiar with
italic
text, right? Italic text
is slanted, and sometimes has extra curly serifs.
For example, compare these two styles:
The
italic
text
is sl
anted
to t
he r
ight
not italic
Italic and oblique
styles are two styles
that give fonts a
slanted appearance.
and
has e
xtra
curls
on t
he se
rifs.
italic
You can add an italic style to your text in
CSS using the
font-style
property:
A commo
n mistake i
s to
write “it
alic” as “it
alics”.
If you d
o, you won't
see
italic te
xt. So reme
mber
to check
your spelli
ng.
font-style: italic;
Unless you can control
the fonts and browsers
your visitors are
using, you'll find that
sometimes you get italic,
and sometimes oblique,
no matter which style
you specify.
However, not all fonts support the italic style,
so what you get instead is called
oblique
text.
Oblique text is also slanted text, but rather
than using a specially designed slanted set of
characters in the font, the browser just applies
a slant to the normal letters. Compare these
non-oblique and oblique styles:
not oblique
The r
egular letters are
slant
ed to the right in
the o
blique style.
oblique
You can use the
font-style
property
to get oblique text too, like this:
font-style: oblique;
So just go with italic
and don't worry about
the differences (you
probably can't control
them anyway).
In practice, you're going to find that, depending
on your choice of font and browser, sometimes
the two styles will look identical, and sometimes
they won't. So, unless italic versus oblique is
very important to you, choose one and move
on. If it
is
important, you'll need to test your
font and browser combination for the best
effect.
