CSS Text Shadow
- Purpose: The text-shadow property in CSS adds a shadow effect to text, creating depth and visual interest.
- Syntax: element { text-shadow: h-shadow v-shadow blur-radius color;}
- h-shadow: The horizontal offset of the shadow. Positive values move the shadow to the right, negative values to the left.
- v-shadow: The vertical offset of the shadow. Positive values move the shadow downwards, and negative values upwards.
- blur-radius: The blur radius of the shadow. Higher values create a more diffused shadow.
- color: The color of the shadow.
- Example:
h1 {
text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}
This will create a shadow on the <h1> elements with:
- A horizontal offset of 2 pixels.
- A vertical offset of 2 pixels.
- A blur radius of 4 pixels.
- A black color with 50% opacity (rgba(0, 0, 0, 0.5)).