HTML and CSS Reference
■ The text-shadow property introduced in CSS3 allows for one or more
<shadow> effects to be applied to the text of an element. This shadow
is drawn around the letters themselves, rather than around the outer
edges of the box like with box-shadow (Chapter 14).
■ none: No text shadow is applied.
■ <shadow> : A description of a single shadow is <color> <offset-x>
<offset-y> <blur-radius> or <offset-x> <offset-y> <blur-radius>
<color> , where <blur-radius> is optional and defaults to a length
of 0 .
text-shadow: rgba(0,0,0,0.5) 2px 2px 5px;
/* transparent black shadow shifted right 2 and down 2 with
a 5px blur */
You can create the appearance of embossed text by mixing light and
dark text-shadow effects, as is done in this multiple-shadow example:
text-shadow: rgba(0,0,0,0.3) 0 -1px, rgba(255,255,255,0.3) 0
Multiple shadows on the same element are drawn front (first shadow
listed) to back (last shadow).