我是否可以使用渐变作为箱形阴影中的选定颜色

Question

我想使箱形阴影在一侧比另一侧显得更暗。

我想这样做如下：

box-shadow: 2px 3px 6px linear-gradient(90deg, #ccc, #fff); 

这可能吗？

Answer 1

Firefox至少不会让你这样做。 Firefox仅以background-image风格支持linear-gradient。

即使浏览器可能允许比Firefox更多的地方出现梯度，他们可能也不会允许这种特殊用法。一般来说，渐变属性只能在允许图像的CSS中工作，而不能取代“正常”的颜色。

你可以做一些鬼鬼祟祟的事情，比如将一个元素的背景图像放在你设置这个盒子阴影的元素后面，你可以使用这个元素使它看起来像阴影在一边是较暗的。尽管如此，这在标记和样式方面会比较复杂。