19

大家好，我正在尝试在 CSS 中使用像 photoshop 这样的锐利属性，但我该怎么做？

这是我的CSS

#login_text
{
 position:absolute;
 top:10px;
 left:18px;
 font-size:13pt;
 font-weight:bold;
 font-family:Arial;

}
4

4 回答 4

21

除了提到的 CSS3text-rendering属性 AMK 之外，还有一个针对抗锯齿的 Webkit (Chrome) 特定 hack：（-webkit-font-smoothing: antialiased;我相信默认值是subpixel-antialiased）很好用，因为 Webkit Webfont 渲染在 Windows 机器上可能不太理想。 更多信息可以在这里找到。

还有一个旧的提议的font-smoothCSS3 属性（见这里），但据我所知，它没有实现，也没有做任何事情（至少我看不到）。

可悲的现实是，您不会在 Web 上获得 Photoshop 质量的字体渲染，尤其是在 Windows 机器上。你可以通过选择好的网络字体和选择自然缩放的字体大小来弥补这一点，但你能做的只有这么多。

于 2012-11-29T14:37:30.640 回答
7

Firefox 25 添加了一个新的 Mac-OS-only 非标准属性-moz-osx-font-smoothing等效于 WebKit 的 -webkit-font-smoothing。

元素 {

-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;

}

于 2014-12-04T02:11:35.713 回答
2

虽然没有“尖锐”的价值，但我认为 CSS3text-rendering属性是最好的选择。这种效果在较小的字体大小上最为明显，对大字体没有太大影响。

请注意，对此的支持非常有限，但据我所知，这是唯一可用的方法。

您的另一个选择（如果您使用自定义字体）是简单地获得更高质量的矢量。

于 2012-11-29T14:25:20.500 回答
-4

看这个例子。Henrique Baldy 解释了锐化的可能方法是什么https://www.linkedin.com/grp/post/2071438-268918276

于 2015-07-24T05:33:15.827 回答