Question

我目前正在Tictail的一家商店工作（它还没有上传，所以我没有链接）。我想对商店使用字体PT Sans Narrow，但是有一个问题：

我的iMac上的Safari和Firefox中的字体显示正确，但当我的朋友在他的PC上的Firefox和Internet Explorer中尝试时，字体无法正确显示。

这就是我正在使用的：

<link href="{{assets_url}}/shared/css/base.css" rel="stylesheet" type="text/css">

body {
    background-color: #fff;
    font-family: 'PT Sans Narrow', sans-serif;
    letter-spacing: -0.02em;
    font-size: 14px;
    line-height: 1.5em;
    color: #222;
    -webkit-font-smoothing:antialiased;
    height: 100%;
}

问题是什么？如何解决？

Answer 1

这是因为Windows没有'PT Sans Narrow'作为默认字体。您需要像网络字体一样添加此字体。例如来自Google Fonts。

最简单的方法：

<link href='http://fonts.googleapis.com/css?family=PT+Sans+Narrow' rel='stylesheet' type='text/css'>

Answer 2

将它放在base.css的顶部。它将从Google字体导入PT Sans Narrow。

@import url(http://fonts.googleapis.com/css?family=PT+Sans+Narrow:400,700);

网页将始终检查用户是否在其计算机上安装了该字体。如果他们不这样做，它将从谷歌字体导入它。

字体在PC上不起作用

2 个答案: