css - wordpress 中的字体与 google 字体中的字体不同

Question

我遇到问题并且已经搜索但我找不到答案。我在我的 Wordpress 网站（Html5Blank 主题）中使用了谷歌字体（Playfair Display），但它看起来与谷歌字体中的非常不同。这就是它们在googlefont和我的网站中的外观。

---

这是我的代码

@import url('https://fonts.googleapis.com/css?family=Playfair+Display:400,700,900|Roboto:100,300');

h3 {
  display: inherit;
  white-space: nowrap;
  font-family: ‘Playfair Display’, serif;
  font-size: 10vw;
  font-weight: 400;
  text-decoration: none;
  margin: 0;
  color: #F4512C;
}

<h3>2017</h3>

Answer 1

这是因为您使用了错误的引号。我认为您刚刚从某个文本文件中复制并粘贴了该行。

使用font-family: 'Playfair Display', serif;代替font-family: ‘Playfair Display’, serif;

@import url('https://fonts.googleapis.com/css?family=Playfair+Display:400,700,900|Roboto:100,300');
h3 {
  display: inherit;
  white-space: nowrap;
  font-family: 'Playfair Display', serif;
  font-size: 80px;
  font-weight: 400;
  text-decoration: none;
  margin: 0;
  color: #F4512C;
}

<div class="parent-class">
  <h3>2017</h3>
<div>

Answer 2