html字体阴影设置,css怎么给字体加阴影？

阴影效果是一个常见也很实用的效果，相信有些朋友在使用阴影效果来美观网页页面时，有时会有一些疑问，比如：字体文字阴影是怎样设置的？下面本篇文章就来给大家介绍一下使用CSS给字体加阴影的方法，希望对大家有所帮助。

在css3中有一个很实用的属性可以给字体文字添加阴影效果，那就是css3 text-shadow属性。text-shadow 属性可以向文本设置阴影。

那么，我们先来详细的看一看text-shadow属性：

text-shadow是CSS样式属性单词，是设置对象中文本的文字字体是否有阴影及模糊效果的CSS样式。

在CSS3中可以用text-shadow属性给页面上的文字添加阴影效果, 可以通过对text-shadow属性设置相关的属性值，来实现一些需要的字体阴影效果,减少了图片的使用。

语法：text-shadow: h-shadow v-shadow blur color;

可以看出text-shadow属性可以设置4个参数，每个参数用空格隔开，下面我们来介绍一下这四个参数：h-shadow： 设置水平阴影的位置(x轴方向)，必需要设置的参数；允许负值。

v-shadow ： 设置垂直阴影的位置(y轴方向)，必需要设置的参数，允许负值。

blur： 阴影模糊的距离(半径大小)，可选择设置的参数。

color ： 阴影的颜色，可选择设置的参数。

注释：text-shadow 属性可以向文本添加一个或多个阴影。该属性是逗号分隔的阴影列表，每个阴影有两个或三个长度值和一个可选的颜色值进行规定。省略的长度是 0。

下面我们来看一个css3设置字体文字阴影的小例子，来具体的感知一下text-shadow属性的用法：

我是一段测试文字

h1{

color:powderblue; /*设置文字颜色*/

text-shadow: 2px 3px 1px pink;/*添加字体文字的阴影*/

}

效果图：

我们再来看看如果不设置css3文字阴影效果会是怎样的：