Demo
Summary
To add a shadow to an element’s text using CSS, use the text-shadow
property:
selector {
text-shadow: 1px 1px 1px green;
}
Details
The text-shadow property takes 4 values. The first value is the offset-x value. It takes a length value, like px or em. A positive value moves the shadow to the right. A negative value moves it to the left.
The second value is the offset-y value. It takes a length value, like px or em. A positive value moves the shadow down. A negative value moves it up.
The third value is the blur-radius. It takes a length value. A higher value here means a bigger blur. It is an optional value. If you leave it out, the value is set to 0.
The last value is the color.
Exercises
First, recreate the CSS code from the Demo section in your CSS file. Then try changing the value for the property.