CSS3 Box Shadow

Question

我正在使用CSS3属性

box-shadow: 2px 2px 2px 2px #CCCCCC;

它在右手侧和底部产生了这种奇怪的效果。 如何使阴影在所有方面都相等？

Answer 1

使用

box-shadow: 0 0 2px 2px #CCCCCC;

代替

请参阅此jsFiddle

前两个数值指定阴影的相对x和y偏移量。因此，你的阴影被（2px，2px）或2px向右和2px向下的向量移位/偏移。

第三个数值指定模糊，第四个数值指定阴影尺寸/展开，第五个颜色指定颜色（以十六进制表示）

Answer 2

使用此：

box-shadow: 0px 0px 2px 2px #CCCCCC; /* Horizontal Length: px, Vertical Length: px, Blur Radius: px, Spread: px, Color */

您可以在此处测试CSS3：http://css3generator.com/

Answer 3

box-shadow定义为：水平偏移 - 垂直偏移 - 阴影扩散 - 模糊大小 - 颜色

您可以这样做：box-shadow: 0 0 2px 2px #ccc;

Answer 4

您可以通过将前2个值设置为0px：

来完成此操作

box-shadow: 0px 0px 2px 2px #CCCCCC;

查看更多：w3schools