与FF和Chrome相比,渲染字体与IE不同

Question

与FF和Chrome相比,渲染字体与IE不同

dbd*_*dbd 4 css firefox internet-explorer google-chrome font-size

我注意到,如果尺寸是,例如,字体的渲染会有很大差异.11像素.运行Windows 7

使用以下HTML和CSS

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>Testing font</title>
        <style>
            body {
                font-family: "Helvetica","Arial",sans-serif;
                color: #1A1A1A;
                padding: 10px;
            }

            .foo{
                font-size: 14px;
            }
            .bar{
                font-size: 11px;
            }
        </style>
    </head>
    <body>
        <div class="foo">
                <p>HOME</p>
        </div>
        <div class="bar">
                <p>HOME</p>
        </div>
    </body>
</html>

Run Code Online (Sandbox Code Playgroud)

如附图所示,FF和Chrome倾向于收紧11px的宽度而不是14px. 在此输入图像描述

为什么会这样,是否有解决方法？

Answer 1

Mar*_*lin 5

Windows 7下的Firefox 7+ 使用GDI经典模式(带提示)来渲染所谓的核心Web字体,如Arial(因为它们更清晰可读,启用了提示),DirectWrite(无提示)用于其他字体.使用GDI模式的特定字体如下所示:config pref:

gfx.font_rendering.cleartype_params.force_gdi_classic_for_families

Run Code Online (Sandbox Code Playgroud)

AFAIK,Firefox中的渲染模式也取决于字体大小.对于足够大的字体大小和太小的字体(可能大于15px,可能小于9px),它也使用DirectWrite for Core Web字体.

Windows 7下的IE9始终使用DirectWrite.

Chrome似乎始终使用GDI经典模式.

归档时间：	13 年，7 月前
查看次数：	7441 次
最近记录：	11 年前