Шрифт в wordpress выглядит иначе, чем в шрифтах google.

У меня проблема, и я уже ищу, но не могу найти ответ. Я использую шрифт Google (Playfair Display) на своем сайте Wordpress (тема Html5Blank), но он выглядит совсем иначе, чем шрифты Google. вот как они выглядят в 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>


wordpress fonts css google-fonts
person Bruno Carvalho    schedule 15.01.2018    source источник
comment
Как стиль, когда вы проверяете в консоли?   -  person br.julien    schedule 15.01.2018
comment
Я думаю, что вы используете здесь неправильные кавычки : "Playfair Display" должно быть Playfair Display   -  person br.julien    schedule 15.01.2018
comment
это то, что появляется в консоли h3 { display: inherit; пробел: nowrap; семейство шрифтов: «Playfair Display», с засечками; размер шрифта: 1.5vw; вес шрифта: 400; цвет: RGB(244, 81, 44); текстовое оформление: нет; поле: 0px; }   -  person Bruno Carvalho    schedule 15.01.2018
comment
спасибо @br.julien, это была проблема! Кстати, я новичок здесь, так как я могу проверить ваш ответ?   -  person Bruno Carvalho    schedule 15.01.2018
comment
Изменить семейство шрифтов: «Playfair Display», с засечками; к семейству шрифтов: «Playfair Display», с засечками;   -  person jaydeep namera    schedule 15.01.2018

Ответы (2)


arrow_upward
0
arrow_downward

В вашем стиле цитаты возникла проблема - используйте 'Playfair Display' вместо ‘Playfair Display’

@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>

person vaishali kapadia    schedule 15.01.2018

arrow_upward
2
arrow_downward

Это потому, что вы использовали неправильные кавычки. Я думаю, вы только что скопировали и вставили строку из какого-то текстового файла.

Используйте 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>

person Bhuwan    schedule 15.01.2018