我发现 CSS 的解释box-shadow有些-moz-box-shadown不精确。
http://www.w3.org/TR/2010/WD-css3-background-20100612/#the-box-shadow
第三个长度是模糊距离。不允许使用负值。如果模糊值为零，则阴影的边缘很锐利。否则，值越大，阴影边缘越模糊。
第四个长度是传播距离。正值会使阴影形状在所有方向上扩展指定的半径。负值会导致阴影形状收缩。
第四个长度是否真的会使用相同的颜色（最暗的阴影），并为指定的宽度重复此操作？所以它不会平滑模糊吗？
它可以实现指定模糊率或淡出率......？
有人非常准确地知道它们是如何工作的吗？
好吧，想象一下盒子阴影开始是一个盒子，与内容大小相同，具有指定的阴影颜色（为了论证的缘故，比如说黑色）。
这个盒子以与内容相同的大小和形状开始生命，就在它的后面——所以，基本上，是不可见的。
这两个距离值会将其向上、向下、向左或向右移动 - 这样它就会从内容后面“窥视”出来。此时，它仍将是一个与其内容大小相同的盒子，并且具有锐利的边缘。
散布值将导致此框按指定的量扩展 - 因此它将大于或小于其内容框。从视觉上看，散布越高，阴影出现的越“向后”（它给人的错觉是盒子离它正在投射阴影的表面很远）。
模糊值只是使边缘平滑地模糊到背景中，从阴影颜色淡入背景颜色。
高温高压
我不是 web/CSS 程序员，但我需要一个看起来像 CSS 的 box-shadow 算法，并决定找出它是如何工作的。
我使用 CSSmatic 的在线 box-shadow 工具进行下面的比较。
该算法似乎有两个步骤。
如图所示，27pxCSS spread inset意味着形状被缩放到尺寸27*2像素更小。这对于轮廓框阴影（例如27*2像素较大）是反转的。
水平/垂直偏移是不言自明的。
Mozilla 开发人员 David Baron 在这里写了一篇关于 CSS box-shadow 实现的详细文章。
直到 2011 年，CSS 模糊半径还没有标准含义。可以对应不同浏览器的不同算法和参数：
不同的浏览器……历史上对相同的模糊半径做了不同的事情，无论是在模糊算法方面，还是在半径对该算法的意义方面（即，给定半径使事情变得多么模糊）。.... 在过去的一年中，CSS 和 HTML 规范发生了变化（对于 CSS）以定义此模糊半径的含义或（对于 HTML）以便它们在此定义上彼此一致。
这些历史差异可以解释moz-前缀（您提到的）和webkit-前缀的目的。这些可能会为 Mozilla 和基于 WebKit的浏览器指定要使用的替代 box-shadow 参数。
由于标准化，我希望这些前缀版本现在已被弃用，但可能用于与旧浏览器的兼容性。
根据 Baron 的说法，现在有一个精确的、标准的 box-shadow 模糊半径定义：
模糊效果现在由 css3-background 和 HTML 定义为 标准偏差 (σ) 等于给定模糊半径的一半的高斯模糊，并允许合理的近似误差。
数学家可以将其扩展为一个精确的公式。
通过在GIMP中反复试验，我发现通过将 CSS 模糊参数乘以 5/3（1.6666...），然后四舍五入到最接近的整数获得的高斯模糊半径会产生非常接近的视觉近似值（到 Firefox 50 中的 CSS）：
7pxCSS 模糊 (Firefox 50) ~~ ceil(7 * 5/3.0) = 12.0GIMP 中的高斯半径
30pxCSS 模糊 (Firefox 50) ~~ ceil(30 * 5/3.0) = 50.0GIMP 中的高斯半径
75pxCSS 模糊 (Firefox 50) ~~ ceil(75 * 5/3.0) = 125.0GIMP 中的高斯半径
Ivan Kuckir 分享了一些快速的高斯模糊算法。