webkit.net 字体_Webkit和Firefox中的字体平滑

webkit.net 字体

I don't pretend to be a typography or design expert -- I just know what looks good and what doesn't.  A few years ago I saw a few CSS properties I didn't recognize and when I toggled them on and off, the text went from beautiful to...not so beautiful.  It was a welcome to the world of font smoothing.  I recommend reading this post to learn more about what font smoothing is, but in this post I'll give you the CSS properties and values you need to know:

我不假装自己是版式或设计专家，我只知道什么看起来不错，什么不好。 几年前，我看到了一些我不认识CSS属性，当我打开和关闭它们时，文本从漂亮变成了……不太漂亮。 这是字体平滑世界的欢迎。 我建议阅读这篇文章，以了解有关什么是字体平滑的更多信息，但是在本文中，我将为您提供您需要了解CSS属性和值：

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

The difference in font presentation with and without font smoothing is fairly significant:

带有和不带有字体平滑的字体呈现方式的差异是非常明显的：

With smoothing:

使用平滑：

Without smoothing:

不进行平滑处理：

The difference is subtle but usually eye-pleasing and softer. When you go about picking custom fonts for your next website, try to experiment with font smoothing -- it may have a large effect on content readability!

差别很小，但通常令人赏心悦目且柔和。 在为下一个网站选择自定义字体时，请尝试进行字体平滑处理-这可能对内容的可读性有很大影响！

翻译自: https://davidwalsh.name/font-smoothing

webkit.net 字体