12

我正在尝试使用 CSS 属性控制 Google Chrome 的（可怕的）字体抗锯齿-webkit-font-smoothing，但它对文本完全没有影响。

<div style="font-size: 42px">
  <p style="-webkit-font-smoothing: subpixel-antialiased">This is a font test.</p>
  <p style="-webkit-font-smoothing: antialiased">This is a font test.</p>
  <p style="-webkit-font-smoothing: none">This is a font test.</p>
</div>

我在 Photoshop 中比较了像素，这三个像素完全相同。Chrome 不再支持此属性了吗？

4

6 回答 6

16

https://productforums.google.com/forum/?fromgroups=#!topic/chrome/0vqp1bnkaoE

-webkit-font-smoothing 不再有效。谷歌浏览器团队有意改变了这种行为。似乎字体平滑在以前的版本中没有在 OSX 上“正确”应用。

于 2013-09-13T12:59:59.843 回答
0

好吧，你是对的。现在不支持字体平滑。它不在新的 CSS 标准中。所以，没有更多的字体平滑。！您可能想在这里查看 w3c 标准。 http://www.w3.org/TR/WD-font/#font-smooth

于 2013-09-13T13:10:09.577 回答
0

如果您使用的是没有字体渲染的浏览器或操作系统，那么这将无法正常工作，您是否尝试过-moz- -o-，Chrome-webkit-必须是您的浏览器才能运行。

于 2013-09-13T13:16:37.763 回答
0

似乎对于某些（系统？）字体，您的测试用例之间存在差异：

body {
   font-family: "HelveticaNeue-Light";
   font-weight: 300;
}

http://jsfiddle.net/gN875/

于 2014-02-12T23:47:23.030 回答
0

您可以尝试语法：

/* Keyword values */
font-smooth: auto;
font-smooth: never;
font-smooth: always;

/* <length> value */
font-smooth: 2em;

尽管出现在 CSS3 字体的早期（2002 年）草案中，但 font-smooth 已被删除，并且该规范不在标准轨道上。 https://developer.mozilla.org/en-US/docs/Web/CSS/font-smooth

于 2018-02-27T20:00:50.843 回答
-1

试试这个 CSS：

div {
  -webkit-text-stroke: 0.6px;
}
<div style="font-size: 42px">
  <p style="-webkit-font-smoothing: subpixel-antialiased">This is a font test.</p>
  <p style="-webkit-font-smoothing: antialiased">This is a font test.</p>
  <p style="-webkit-font-smoothing: none">This is a font test.</p>
</div>

于 2014-11-12T01:51:19.903 回答