Question

我正在尝试在具有两个不同权重（300和800）的html页面中使用Open Sans Web字体。但这些重量之间的差异非常小（使用IE11，Chrome测试）。你可以在下面看到我得到的图像和看起来像什么（来自谷歌字体网站）。

我的结果：

My result

Google的结果：

Google result

我的HTML代码是：

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>font test</title>
    <link href='http://fonts.googleapis.com/css?family=Open+Sans&subset=latin,vietnamese' rel='stylesheet' type='text/css'>
    <link href="styles/style.css" rel="stylesheet" type="text/css" media="screen" />
</head>
<body>
    Font Family: Open Sans <br />
    font-weight 300: <span id="test">GGG</span><br />
    font-weight 800: <span id="test2">GGG</span><br />
</body>
</html>

和css：

#test
{
    font-family: 'Open Sans' !important;
    font-style: normal !important;
    font-weight: 300 !important;
    font-size: 32px;
}

#test2
{
    font-family: 'Open Sans' !important;
    font-style: normal !important;
    font-weight: 800 !important;
    font-size: 32px;
}

Answer 1

我在

中看不到重量

<link href='http://fonts.googleapis.com/css?family=Open+Sans&subset=latin,vietnamese' rel='stylesheet' type='text/css'>

将其替换为：

<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,800' rel='stylesheet' type='text/css'>

它会起作用。

http://codepen.io/anon/pen/KGhbt/

Google Web Fonts font-weight无法正确呈现

1 个答案: