CSS text-shadow 属性

CSS text-shadow属性类似于box-shadow属性,但阴影应用于每个字母而不是元素的边界:

text-shadow: 2px 2px 1px rgba(0,0,0,0.4);

值按以下顺序排列:offset-x offset-y blur-radius color.

您还可以定义多个阴影:

text-shadow: 45px 25px 4px rgb(25,93,229),
             25px 15px 1px rgb(25,93,229);

请注意,与box-shadow属性一样,您可以定义多个逗号分隔的阴影。box-shadow但是,与 with 不同的是,您不能定义展开值或使用inset关键字进行文本阴影。有多种方法可以创建看起来像插入阴影的文本阴影,但阴影本身实际上不会被插入。

结果

这是上述代码段中 2 个文本阴影的结果:

我只是世界上一些带有基本阴影的文字。

我只是世界上有两个阴影的文字。

觉得文章有用?

点个广告表达一下你的爱意吧 !😁