如何在CSS中实现非常轻微的文本阴影?

时间:2014-03-04 15:34:07

标签: css css3

CSS中的

属性是在HTML中为动态文本设置阴影的好方法。然而,浏览器(尤其是safari,firefox)会以非常低的设置呈现相当强烈的阴影:

text-shadow:1px 1px 2px #000; // still quite strong
text-shadow:1px 1px 2px #000; // still quite strong
text-shadow:0.01em 0.01em 0.01em #000; // some browsers do not even display this

如何实现交叉浏览器兼容的文本阴影,这些阴影仍然不如前两个给定的文本阴影强,但仍然显示?这个问题有解决方案吗?

2 个答案:

答案 0 :(得分:3)

尝试使用“较弱”的颜色:

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

根据需要调整0.25 - 0的值将不可见,1将与您当前使用的#000相同。

答案 1 :(得分:1)

您可以尝试半透明text-shadow

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

Demo