Как подключить woff2, почему не работает, как самому хостить шрифты Google Fonts?

Question

[wiyod]

Подключаю шрифт, беру ссылку из ссылки гугла https://fonts.googleapis.com/css?family=Roboto+Sla...

Получается

@font-face
  font-family: 'Roboto Slab'
  font-style: normal
  font-weight: 400
  src: local('Roboto Slab Regular'), local('RobotoSlab-Regular'), url('https://fonts.gstatic.com/s/robotoslab/v7/y7lebkjgREBJK96VQi37ZjTOQ_MqJVwkKsUn0wKzc2I.woff2') format('woff2')
  unicode-range: U+0460-052F, U+20B4, U+2DE0-2DFF, U+A640-A69F

Только вместо урл на сервера Гугла скачал этот файл и раздаю со своего.
Не работает! (впрочем, не работает и если указать урл Гугла тоже)
Как подключить?
Хочу самому хостить шрифты.

Answer 1

[Odisseya]

В HTML обычно подключают в что-то вроде:

<link href="https://fonts.googleapis.com/css?family=Roboto+Slab:300,400,700&amp;subset=cyrillic" rel="stylesheet">

а потом в CSS используем нужное font-family.

Если хотите подключать из CSS, используйте @import:
@import url('https://fonts.googleapis.com/…')

Если подгружаете от себя — нужно подключить все необходимые начертания и сконвертированные версии шрифта.

Comments

[wiyod]

Я разве спрашиваю как подключить шрифт с сервера Гугла? Какое отношение этот ответ имеет к вопросу?

[Odisseya]

Именно, что спрашивали, ваши слова: «Как подключить? ». Ну да ладно.
В остальном, Гугл отдает 200 и хоть закачанным к себе файлом, хоть напрямую — код прекрасно работает:

@font-face {
  font-family: 'Roboto Slab';
  font-style: normal;
  font-weight: 400;
  src: local('Roboto Slab Regular'), local('RobotoSlab-Regular'), url(https://fonts.gstatic.com/s/robotoslab/v7/y7lebkjgREBJK96VQi37ZjUj_cnvWIuuBMVgbX098Mw.woff2) format('woff2');
  unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

Поэтому, ищите ошибку в подключении.