在CSS中为PNG图像添加阴影

Question

我有一个PNG图片，该图片具有自由格式（非正方形）。

我需要对此图像应用阴影效果。

标准方法...

-o-box-shadow:      12px 12px 29px #555;

-icab-box-shadow:   12px 12px 29px #555;

-khtml-box-shadow:  12px 12px 29px #555;

-moz-box-shadow:    12px 12px 29px #555;

-webkit-box-shadow: 12px 12px 29px #555;

box-shadow:         12px 12px 29px #555;

...显示该图像的阴影，就像一个正方形。因此，我看到了我的图像和正方形阴影，它没有遵循对象的形式显示在图像中。

有什么办法可以正确地做到这一点吗？

Answer 1

如果您要为阴影添加超过100张图像，建议您使用命令行程序ImageMagick。这样，您只需键入一个命令就可以将定型的阴影应用于100张图像！例如：for i in "*.png"; do convert $i '(' +clone -background black -shadow 80x3+3+3 ')' +swap -background none -layers merge +repage "shadow/$i"; done上面的（shell）命令获取当前目录中的每个.png文件，应用下拉阴影，并将结果保存在shadow /目录中。如果您不喜欢生成的阴影，则可以对参数进行大量调整；否则，请执行以下操作。首先查看有关阴影的文档，常规用法说明中有许多很酷的示例，可以对图像进行处理。如果您以后对投影效果的外观改变主意-这只是生成具有不同参数的新图像的命令之一:-)