Как именно использовать правило @font-face?

#html #css #fonts #font-face

#HTML #css #шрифты #font-face

Вопрос:

В настоящее время я сталкиваюсь с проблемой, когда я пытаюсь изменить шрифт на своем веб-сайте на Helvetica Neue Bold . Я провел некоторое исследование по этому вопросу, и, возможно, я просто пропустил отметку здесь. Я взял шрифты и прогнал их через генератор шрифтов, затем я создал папку в папке css с надписью «Шрифты» с указанным шрифтом в папке. В-третьих, я добавил следующий код в theme.css

 @font-face {
font-family: "Helvetica Neue Bold";
src: url("css/fonts/HelveticaNeueLTStd-Bd.eot");
src: 
url("css/fonts/HelveticaNeueLTStd-Bd.woff") format("woff"),
url("css/fonts/HelveticaNeueLTStd-Bd.ttf") format("truetype"),

}
  

Наконец, в моем режиме предварительного просмотра с использованием программы кодирования в скобках я использую код

      <a class="navbar-brand" href="#">
<font face="Helvetica Neue Bold" color="white" size="4">REVOL</font>
    </a>
  

и я не вижу изменения шрифта на желаемое начертание шрифта? Я не уверен, что я делаю неправильно. Есть идеи? Заранее благодарю вас за помощь.

Ответ №1:

<font> Тег использовался в HTML 4 для указания начертания шрифта, размера шрифта и цвета текста. Для получения дополнительной информации об этом, пожалуйста, обратитесь сюда

Таким образом, вы можете применить шрифт напрямую, который вы можете использовать font-family в css (встроенном или внешнем) с именем, указанным как часть @font-face .

 @font-face {
  font-family: "Helvetica Neue Bold";
  src: url("css/fonts/HelveticaNeueLTStd-Bd.eot");
  src: url("css/fonts/HelveticaNeueLTStd-Bd.woff") format("woff"), url("css/fonts/HelveticaNeueLTStd-Bd.ttf") format("truetype"),
}

.paragraph {
  font-family: "Helvetica Neue Bold";
}  
 <a class="navbar-brand" href="#">
  <p class="paragraph">REVOL</p>
</a>

<!-- or -->
<a class="navbar-brand" href="#">
  <p style="font-family: 'Helvetica Neue Bold'">REVOL</p>
</a>