小编joh*_*ley的帖子

Firefox没有抗锯齿缩放背景svg

我正在开发一种响应式设计,要求标题图形与视口的宽度一致.我已经选择了svg,认为这样可以很好地扩展.(我在完整站点测试svg支持,并用svg替换gif).在Firefox(Windows 7上的13.0)中,它不是小尺寸的抗锯齿.它偶尔看起来很好看一些尺寸,如果我修复了尺寸,但我想避免这样做.Chrome和Safari会对图像进行反锯齿处理,看起来不错.

我正在设置background-size: 100% 100%缩放到容器,我也尝试了类似的东西cover,但似乎没有任何区别.

我也试过添加image-rendering: optimizeQuality;,但这似乎没有帮助.

我在http://axminster.digital.linneydesign.com/svg/上设置了一个测试页面- 最上面一个是背景图像,下面的一个是完全相同的文件,但是在html中直接添加为img.将浏览器缩小到小尺寸,您将看到顶部像素化,但底部将保持平滑.

有关如何在不修复尺寸的情况下平滑此背景图像的任何想法?

谢谢.

css firefox svg background-image

8
推荐指数
1
解决办法
5536
查看次数

标签 统计

background-image ×1

css ×1

firefox ×1

svg ×1