1

我在使用Google Web Fonts上找到的字体时遇到了一些问题。

正如您在下面发布的图片中看到的那样，当我使用 Firefox 时，“Versus”中的大写 V 与“e”重叠。虽然当我使用 Chrome（或 IE）时，它不会重叠，并在两个字符之间留下难看的空间。

有没有办法解决这个问题，让它看起来像 Firefox 中的一样？还是我应该开始寻找另一种字体？

Chrome/IE 和 Firefox 比较

我的 HTML：

<html>
<head>
    <meta charset="utf-8">
    <title>Versus</title>
    <link rel="stylesheet" type="text/css" href="css/reset.css" />
    <link rel="stylesheet" type="text/css" href="css/style.css" />
    <link href='http://fonts.googleapis.com/css?family=Marck+Script' rel='stylesheet' type='text/css'>
</head>
<body>
    <div>
        <h1>Versus</h1>
    </div>
</body>

我的 CSS：

h1 {
font-family: 'Marck Script', cursive;
font-size: 100px;
color:#444;
text-align:center;
padding:0 50px;
text-shadow: 2px 2px 3px #777;

}

提前致谢！

4

2 回答 2

2

为了修复字体中的间距，您应该使用：

letter-spacing: 10px /* How ever much you need */

在不知道您已经拥有的 HTML 和 CSS 的细节的情况下，您可以使用以下方法修复问题区域：

风格

span { letter-spacing: -4px }

html

<span>V</span>ersus

这是 hokie，但它应该工作。

于 2012-09-20T20:25:44.483 回答
1

Firefox 现在在使用带有字距调整对的字体时支持字距调整。其他浏览器还没有赶上。有几个提议的 CSS 功能会影响字距调整，Firefox 对它们有一些支持，但其他浏览器不支持。

所以你应该寻找另一种字体。letter-spacing通过或margin属性手动调整间距既麻烦又冒险；你很容易在 Firefox 上搞砸了。

如果您继续使用 Marck Script 字体，最好下载它并将其安装在您的服务器上并从那里使用它。在 Google 服务器上使用时，许多 Google 字体存在问题。在这种情况下，标准模式下的 IE 9 不使用该字体；错误代码 CSS3117 出现在控制台中，因此 Google 设置中显然有问题。

于 2012-09-20T21:57:26.563 回答