misterkey

Установка нестандартного шрифта заголовка

Рекомендуемые сообщения

misterkey    1

Мне нужно установить шрифт заголовков h1 в стиле DS Arabic. Установил на комп этот шрифт, поэксперементировал. Прописал его в css. На сайте выглядит отлично. Но вот при заходе с телефона, или другого компа, этот шрифт отображается стандартным. Кто нибудь может подсказать в чем может быть проблема ?

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
Garri    80

Мне нужно установить шрифт заголовков h1 в стиле DS Arabic. Установил на комп этот шрифт, поэксперементировал. Прописал его в css. На сайте выглядит отлично. Но вот при заходе с телефона, или другого компа, этот шрифт отображается стандартным. Кто нибудь может подсказать в чем может быть проблема ?

это означает скорее всего что ваш браузер на телефоне его не распознает.

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
misterkey    1

это означает скорее всего что ваш браузер на телефоне его не распознает.

Ну в том то и проблема что шрифт будет отображаться только там где он установлен помимо "стандартного" набора.

Нашел решение:

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

Вам наверное не раз хотелось установить на вашей странице какой либо красивый шрифт, но к сожалению его может не быть у других пользователей и тогда он будет заменён каким либо из "стандартного" набора.

Поскольку давать пользователям ссылку на шрифт с просьбой установить - дурной тон. Я научу вас как это делается!

Итак, делать это мы будем при помощи правила @font-fase. Оно позволяет задать шрифт и его параметры, а также загрузить шрифт на компьютер пользователя и использовать его при необходимости в браузере.

Синтаксис правила:

@font-face { свойства шрифта }

Свойства шрифта:

  • font-family - имя семейства (название) шрифта
  • font-style - стить шрифта (normal | italic | oblique | inherit)
  • font-weight - "вес" шрифта (normal | bold | bolder | lighter | 100 | 200 | 300 ...)
  • src - ссылка на шрифт
Ссылка задаётся при помосчи url (также можно добавить формат шрифта):

src: url('http://cсылка на шрифт') format('truetype');

Добавив запись @font-fase в ваш CSS файл вы можете использовать указанное в свойстве font-family имя шрифта.

@font-face {

font-family: 'Howto'; /* Имя шрифта */

src: url(http://how2.org.ua/fonts/Howto.ttf); /* Путь к файлу со шрифтом */

}

p {

font-family: 'Howto';

}

Подробнее в статье: http://how2.org.ua/art/25

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
Garri    80

Вам наверное не раз хотелось установить на вашей странице какой либо красивый шрифт, но к сожалению его может не быть у других пользователей и тогда он будет заменён каким либо из "стандартного" набора.

Поскольку давать пользователям ссылку на шрифт с просьбой установить - дурной тон. Я научу вас как это делается!

Всегда актуально)

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Для публикации сообщений создайте учётную запись или авторизуйтесь

Вы должны быть пользователем, чтобы оставить комментарий

Создать учетную запись

Зарегистрируйте новую учётную запись в нашем сообществе. Это очень просто!

Регистрация нового пользователя

Войти

Уже есть аккаунт? Войти в систему.

Войти


  • Последние посетители   0 пользователей онлайн

    Ни одного зарегистрированного пользователя не просматривает данную страницу