Question

创建网页时我总是遇到同样的问题。当我添加一个大于16-18px的字体时，它看起来很糟糕。它的锯齿状和像素化。我尝试过使用不同的字体和重量，但是我没有那么多运气。

注意：它只在Windows中才是这样的。主要在Opera和FF中也在IE7中但并不是那么糟糕。在Linux中，字体看起来很好。我没有看过Mac。

你们有什么办法解决这个问题？如果有什么。我注意到SO上的标题也很杂乱，但它们只是小到不看起来很糟糕。

Answer 1

您无法阻止用户更改其操作系统呈现字体的方式。如果它对您来说是一件大事，那么您可以用图像替换大标题，这样您就可以精确控制字体的呈现方式（并确保标题看起来完全符合您的意愿，即使用户没有您的建议字体安装）。

如果这样做，请确保为那些看不到图像的人提供替代文本表示。我倾向于使用CSS来显示背景图像，并隐藏标题的内容。像这样。

<style>
    h1
    {
        height: 32px;
        width: 100px;
        background: url("path/to/image")
    }

    h1 span
    {
        display: none;
    }
</style>

<h1>
    <span>
       Heading Text
    <span>
</h1>

说实话，如果它出现在所有大文本上，这似乎有点矫枉过正。请注意，它会增加客户端下载所需的数据量。但是对于大型标题，此方法可能会导致看起来比OS渲染文本更好的东西。

Answer 2

启用消除锯齿功能可以解决显示问题。

Answer 3

除了消除锯齿功能外，请尝试启用清除类型。

Answer 4

在Windows上，启用ClearType即可解决此问题。但是，您无法强制用户使用它。这不是浏览器问题;它是操作系统的字体平滑方法。

网页的字体渲染

4 个答案: