CSS3 text-shadow
Here, we put a shadow on the character, will introduce the "text-shadow".
It is basically the same as the description made in the box-shadow.
div#t-shadow p{
font-size:32px;
font-weight:bold;
color:#FFFFFF;
text-shadow:3px 3px 3px rgba(0,0,0,0.45);
}
SHADOW-shadow
In addition, here by putting a negative value, it is also possible the following expression.
div#t-shadow p{
font-size:32px;
font-weight:bold;
color:#FFFFFF;
text-shadow:-2px -1px -2px 1px rgba(0,0,0,0.75);
text-shadow: 0px -2px 1px rgba(0,0,0,0.75);
text-shadow: -1px -2px -2px 1px rgba(0,0,0,0.75);
text-shadow: -2px 0px 1px rgba(0,0,0,0.75);
}
SHADOW-shadow
Furthermore not only the shadow, you can also shoot the glow.
div#t-shadow p{
font-size:32px;
font-weight:bold;
color:#FFFFFF;
text-shadow:0px 0px 10px rgba(255,255,255,1);
}
SHADOW-shadow
In this way you can representation of three-dimensional character.
In combination with other CSS, it may be more interesting representation.
[reference]CSS Reference