css中的Photoshop样式抗锯齿样式

时间:2011-04-15 00:22:46

标签: css fonts antialiasing

我正在为我们拥有新网站的PSD模型设置样式表。模型中的大多数文本都使用了photoshop中的“锐利”抗锯齿方法。

重新创建这种photoshop抗锯齿方法的最佳方法是什么?设置不同的字体权重似乎已关闭..

顺便说一下,字体是Arial,所以这里没有有趣的@ font-face东西

4 个答案:

答案 0 :(得分:2)

一个简单的替代方案是text-shadow,它是一个css3属性:

#foo {
    /* text-shadow: [color] [horizontal offset] [vertical offset] [blur] */
    text-shadow: #fff 0 1px 0;
}

玩弄设置;通过尝试不同的颜色和模糊值,你可以使一个非常锋利的结束前卫看起来字体平滑。

答案 1 :(得分:1)

font-smooth CSS3属性可能很有用:

font-smooth: auto | never | always | <absolute-size> | length | initial | inherit 

答案 2 :(得分:0)

由于您的网站将在多个操作系统的多个浏览器中显示,因此无法获得一致的字体显示。我认为这是关于字体平滑的操作系统。

如果需要,请将这些部分渲染为图像或使用Cufon或sIFR。

我过去也做了什么,如果字体有点粗糙,添加一个微妙的CSS3 text-shadow,使它看起来更平滑。

答案 3 :(得分:0)

您可以使用基于脚本的库(cufón)来自定义消除锯齿和其他文本呈现效果。请注意,大多数(如果不是全部)此类解决方案仅适用于标题和诸如此类的内容,而不适用于正文。