Question

有没有人知道在Firefox中使用反别名svg文本的最佳方法？

我尝试了text-antialias：true但是没有效果，而且我尝试使用描边颜料，但这只会使字体变粗，而不是我喜欢的颜色。

示例：

<!DOCTYPE html>
<html>
<body>
<svg height="100" width="500">
<text y="50" x="250" text-anchor="middle" style="font-size: 40px" >Hello</text>
</svg>
</body>
</html>

我已将此上传到http://jsfiddle.net/KJhrY/

此示例在我的PC上的IE9中显示抗锯齿（Windows）

Answer 1

Firefox 25 will have support用于mox-osx-font-smoothing属性！

因此对于firefox 25，您可以使用：

.yourclass{
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

Firefox 25 ~~可能会在2013年2月29日发布的end of Oktober~~ 某处发布。
每晚构建可以在http://nightly.mozilla.org/

找到

Answer 2

尝试“文字渲染”属性 text-rendering =“optimizeLegibility”

如何在Firefox中对抗SVG文本

2 个答案: