我正在使用滑动轮播制作信息图 <li>
s,但是 SVG 在 Firefox 中显示为像素化,即使 FF 中 SVG 的错误已经解决,我想。任何人都可以看到解决此问题的方法吗?
最佳答案
您正在将 SVG 文件缩放到非常大的尺寸:
background-size: 9730px 30000px;
background-position: -7310px -29250px;
大多数浏览器不会对非常大的 SVG 形状进行抗锯齿处理,因为它需要太多的图形内存。 (这是我们在 Safari 和 Chrome 中看到的。)看起来 Firefox 实际上是将 SVG 渲染到 Canvas 的大小,然后通过图像插值将其放大到裁剪区域。
两者的修复是相同的:
首先裁剪 SVG,然后仅使用裁剪部分作为背景。
关于html - SVG 在 Firefox 中渲染不佳,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5623436/