Chrome和Firefox中相同的框阴影大小的不同输出

Question

为什么box-shadowChrome和Firefox的尺寸不同？

box-shadow: 0 0 4px #aaa inset;

铬:

火狐:

我已经尝试了以下内容,但它不适用于最新的Firefox.

-moz-box-shadow: 0 0 2px #aaa inset;
-webkit-box-shadow: 0 0 4px #aaa inset;

如何以相同的大小设置跨浏览器框阴影？

Answer 1

w3schools说盒子阴影有6个值:

box-shadow: h-shadow v-shadow blur spread color inset;

模糊和传播是可选的,我的猜测是,因为你只在颜色之前定义了三个值,所以两个浏览器的解释方式不同.

我让他们看起来一样(至少我的眼睛)以下js小提琴:

-moz-box-shadow: 0px 0px 3px 0px #aaa inset;
-webkit-box-shadow: 0px 0px 5px 0px #aaa inset;

希望这可以帮助