Скачать для фотошопа и для создания сайта Суббота, 13.07.2024, 22:43
Приветствую Вас Гость | RSS
[ Обновленные темы · Новые сообщения · Участники · Правила форума · Поиск · RSS ]
  • Страница 1 из 1
  • 1
Добавление шрифта на сайт CSS
MarcoДата: Вторник, 05.12.2023, 00:07 | Сообщение # 1
Генералиссимус
Группа: Администраторы
Сообщений: 1691
Offline
Подключение нового шрифта на сайт не самая простая задача. Где выбрать, скачать и как добавить шрифт на сайт в CSS? В этой статье мы покажем один из самых удобных способов установки и подключения шрифта на сайт.

Добавление шрифта на сайт или блог
Например, у нас есть шрифт Raleway.ttf и мы хотим использовать его во всех заголовках (h1) нашего сайта или блога. Для этого выполняем следующие действия:
❶ В корневой папке сайта создаём папку «fonts» и копируем туда наш Raleway.ttf;
❷ В самом низу файла стилей(style.css) прописываем правило:

Код
@font-face {// название шрифта(чтобы не запутаться лучше указать название папки со шрифтом) font-family: "RalewayRegular"; // адрес шрифта и тип src: url("../fonts/RalewayRegular.ttf") format("truetype"); font-style: normal; font-weight: normal; }

 
❸ А также в файле стилей задаём правило для всех заголовков:

Код
h1{font-family: "RalewayRegular";}


Теперь все заголовки 1-го уровня на сайте отображаются с нужным нам шрифтом. Если вы хотите подключить несколько шрифтов(или их начертаний), то просто добавьте их под предыдущим:

Код
@font-face {font-family: "RalewayRegular";  src: url("../fonts/RalewayRegular.ttf") format("truetype"); font-style: normal; font-weight: normal; }@font-face{ font-family: "RalewayBold"; src: url("../fonts/RalewayBold.ttf") format("truetype"); font-style: normal; font-weight: normal; }


Скачать отличные русские шрифты для своего ресурса вы можете на нашем сайте: Раздел Все для вебмастера  Шрифты для сайта.


Скоро новый год
 
  • Страница 1 из 1
  • 1
Поиск:

Copyright MyCorp © 2024