Question

我的网页上的文字在Safari，Opera和Chrome上显得模糊：http://testowa.portalo.pl/wiadomosci.php

我正在使用这样的CSS：

.tytulmalykom {
    color:#666666;
    font-size:11px;
    font-variant:small-caps;
}

在Firefox和Internet Explorer上运行正常。还有其他选择吗？

Answer 1

大多数字体缺少小型字体，因此font-variant:small-caps会使浏览器生成虚假的小型字母。他们通过转换为大写并减小字体大小来实现此目的。结果从可容忍到可怕，取决于字体，浏览器，显示设备和其他因素。除此之外，不同的浏览器在这里应用不同的大小缩减。

因此，您可以通过自己进行大小写转换和字体大小缩减来获得更一致的结果。如果文本是混合大小的，那么它会变得笨拙，因为要用小型大写字母保存“Foo”以保持区分，你需要使用F<span class="sc">oo</span>（并设置text-transform: uppercase和font-size: ...在.sc）。结果不会是印刷好的;你需要一个印刷师设计的小帽子字体。但至少你有可能在不同的浏览器上减少相同的字体大小。（不保证，因为在应用字体大小方面存在细微差别。）

font-variant：小型大写在IE和Firefox上运行正常，在Safari，Opera和Chrome上看起来很模糊

1 个答案: