是否可以为svg图像添加阴影?

时间:2014-08-27 02:03:45

标签: html5 css3 svg svg-filters

我一直在做一些关于使用svg图像的研究,并且发现了很多好读。虽然我还没有很好地掌握svg,但仍然在努力并尝试它。我在此发现的大部分信息都适用于基本形状和一些图像或图标字体。如果我有一个svg文件格式的自定义徽标文字标记,我将其包含在我的css中:

.logo { width: 230px; height: 230px; margin: 0 auto; background: url(../imgs/logo-01.svg) center no-repeat; }

是否可以在字标本身上添加阴影,以便字体具有阴影效果?

2 个答案:

答案 0 :(得分:0)

答案:是的,不是。您可以使用不同的方法,而不是仅CSS方法。在这种情况下,您正在寻找的是feOffset过滤器,支持范围广泛但尚未完成。

您可以阅读一些SVG过滤器教程here

答案 1 :(得分:0)

最简单的方法是进入并编辑svg文件,直接在图像中添加阴影滤镜。从webplatform文档开始&教程:

http://docs.webplatform.org/wiki/svg/elements/filter http://docs.webplatform.org/wiki/svg/tutorials/smarter_svg_filters