最近一位客户抱怨IE6中出现了系统字体.基本上问题是IE6不支持字体平滑/抗锯齿(我知道你可以在OS设置或其他东西中打开它).但有人抛弃了这个宝石:
"你可以使用pt而不是px强制css中的字体反别名."
我在各种浏览器中做了一个快速的POC,并没有看到任何区别.我在网上发现了一个对它的引用,这篇论坛的最后一篇文章:
http://www.webmasterworld.com/css/3280638.htm
这听起来像是一个网络开发者城市神话,我的感觉是它的BS.有没有人遇到过它？
Rya*_*die 47
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-smoothing: antialiased;
Firefox的来源,感谢贾斯汀的提升.
Bar*_*fen 39
CSS3中有这些令人兴奋的新属性:
font-smooth:always;
-webkit-font-smoothing: antialiased;
尽管如此,他们仍然没有对他们进行太多测试,他们几乎肯定不会对IE有任何好处.可能对Windows上的Chrome或Firefox有用.上次我检查时,他们并没有像在OSX中那样自动地对抗小东西.
UPDATE
IE或Firefox不支持这些.只要我记得,font-smooth属性仅在iOS safari中可用
Cha*_*rch 29
不,作为Web开发人员,没有任何方法可以控制它.
小的例外是你可以通过sIFR使用Flash来做一些伪造的抗锯齿,而且有些浏览器不会对位图/像素字体进行反别名(因为它们不应该,更多信息:Anti-Aliasing/Anti-Anti -Aliasing).
此外,正如丹尼尔所提到的,使用em所有字体的单位是理想的,有关此内容的更多信息,请参阅使用CSS的The Incredible Em&Elastic Layouts.
biz*_*lop 15
我找到了一个非常尴尬的解决方案,使用缩放和过滤ms-only属性示例(尝试没有aa,标准和cleartype):http://nadycoon.hu/special/archive/internet-explorer-force-antialias.html
这个怎么运作:
-zoom up zoom with zoom:x,x> 1
- 应用一些模糊(或任何其他过滤器)
-zoom向下缩放:1/x
它有点慢,非常!记忆力很大的方法,在非白色背景上它有一些轻微的黑暗光环.
CSS:
.insane-aa-4b { zoom:0.25; }
.insane-aa-4b .insane-aa-inner { zoom:4; }
.insane-aa-4b .insane-aa-blur { zoom:1;
filter:progid:DXImageTransform.Microsoft.Blur(pixelRadius=2);
}
HTML:
<div class="insane-aa-4b">
<div class="insane-aa-blur">
<div class="insane-aa-inner">
<div style="font-size:12px;">Lorem Ipsum</div>
</div></div></div>
您可以使用这个简短的jQuery来强制消除锯齿,只需将ieaa类添加到任何东西:
$(function(){ $('.ieaa').wrap(
'<div style="zoom:0.25;"><div style="zoom:1;filter:progid:DXImageTransform.Microsoft.Blur(pixelRadius=2);"><div style="zoom:4;"><'+'/div><'+'/div><'+'/div>'
); });
添加以下CSS行适用于Chrome,但不适用于Internet Explorer或Firefox.
text-shadow: #fff 0px 1px 1px;
我不同意Chad Birch.我们可以强制消除锯齿,至少在Chrome中使用简单的css技巧与-webkit-text-stroke属性: -
-webkit-text-stroke: 1px transparent;