文字阴影不透明度

Posted 2023-03-06

【中文标题】文字阴影不透明度

【英文标题】：Text shadow opacity

【发布时间】：2012-07-17 23:36:09

【问题描述】：

是否可以只调整文本阴影的不透明度，而不是调整文本本身？

例如，我有带有蓝色阴影的紫色文本。我想让蓝色阴影不透明，而不会丢失紫色上的任何东西。

h1.blue text-shadow: 3px 3px 0px #3f6ba9;

【参考方案1】：

可以，但在 rgba 模式下指定颜色以添加 alpha 透明度。

h1.blue text-shadow: 3px 3px 0px rgba(63,107,169, 0.5) //half of transparency

【参考方案2】：

为希望使用 HEX 代码而不是 RGB 的任何人添加答案：

h1.blue text-shadow: 3px 3px 0px #3f6ba980;

上述 HEX 代码中的最后 2 个字符的不透明度设置为 50%。对于其他不透明度值，请参阅链接here 的不透明度十六进制图表。或者，如果您使用的是 VScode，您将能够使用其内置的颜色选择器来调整不透明度。