Home >Web Front-end >CSS Tutorial >How to use text-shadow attribute
How to use text-shadow attribute
- 青灯夜游Original
- 2019-01-30 14:26:547584browse
The text-shadow property is used to add a shadow effect to the text. Through this property, we can set the position, blur distance and color of the horizontal or vertical shadow.
CSS3 text-shadow property
Function: Apply shadow to text.
Description: Set or retrieve whether the text in the object has shadow and blur effects.
Syntax:
text-shadow: h-shadow v-shadow blur color;
h-shadow: The position of the horizontal shadow. Negative values are allowed.
v-shadow: The position of the vertical shadow. Negative values are allowed.
blur: Blurred distance, can be omitted.
color: The color of the shadow, can be omitted.
Description: The text-shadow property adds one or more shadows to the text. This property is a comma-separated list of shades, each shade specified with two or three length values and an optional color value. The omitted length is 0.
CSS3 Text-shadow attribute usage example
<!DOCTYPE html>
<html>
<head>
<style>
h1
{
text-shadow: 5px 5px 5px #FF0000;
}
</style>
</head>
<body>
<h1>文本阴影效果！</h1>
</body>
</html>Rendering:
The above is the entire content of this article, I hope it will be helpful to everyone's study. For more exciting content, you can pay attention to the relevant tutorial columns of the PHP Chinese website! ! !
The above is the detailed content of How to use text-shadow attribute. For more information, please follow other related articles on the PHP Chinese website!