如何设置文字的阴影
如何设置文字的阴影？
转载自https://www.cnblogs.com/Renyi-Fan/p/9262595.html
一、总结（点击显示或隐藏总结内容）
一句话总结：text-shadow属性。text-shadow:3px 3px 3px #f0f;
1、text-shadow属性的参数依次是什么意思？
水平及垂直偏移
模糊距离（这个参数相当于ps里面的羽化半径）
颜色
2、所有阴影类的属性必备的三个属性是什么（带上颜色是四个）？
水平及垂直偏移
模糊距离（这个参数相当于ps里面的羽化半径）
二、如何设置文字的阴影
1、相关知识
文本样式:
1.text-shadow
text-shadow:3px 3px 3px #f0f;
1.text-shadow
text-shadow:3px 3px 3px #f0f;
语法
text-shadow: h-shadow v-shadow blur color;
注释：text-shadow 属性向文本添加一个或多个阴影。该属性是逗号分隔的阴影列表，每个阴影有两个或三个长度值和一个可选的颜色值进行规定。省略的长度是 0。
| 值 | 描述 | 测试 |
|---|---|---|
| h-shadow | 必需。水平阴影的位置。允许负值。 | 测试 |
| v-shadow | 必需。垂直阴影的位置。允许负值。 | 测试 |
| blur | 可选。模糊的距离。 | 测试 |
| color | 可选。阴影的颜色。参阅 CSS 颜色值。 | 测试 |
2、代码
文字的阴影
1 <!doctype html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <title>index</title>
6 <style>
7 *{
8 font-family: 微软雅黑;
9 }
10
11 p{
12 text-shadow:3px 3px 3px #00f;
13 }
14 </style>
15 </head>
16 <body>
17 <div>
18 <p>linux is very much!</p>
19 <p>linux is very much!</p>
20 <p>linux is very much!</p>
21 <p>linux is very much!</p>
22 <p>linux is very much!</p>
23 </div>
24 </body>
25 </html>
