Как использовать Font Awesome в автономном режиме? - PullRequest
Новая
       114

Как использовать Font Awesome в автономном режиме?

0 голосов
/ 08 мая 2020

Font awesome - это сервис, предоставляющий бесплатные / платные значки, и иногда мы хотим использовать его в автономном режиме как часть нашего собственного проекта, чтобы удалить зависимость от сетевого ресурса. но как? иногда мы думаем, что выполнили все шаги, упомянутые в статье, но что-то упускаем. и поэтому я пишу эти вопросы и ответы.

1 Ответ

0 голосов
/ 08 мая 2020

Сначала следуйте их статье: https://fontawesome.com/how-to-use/on-the-web/setup/hosting-font-awesome-yourself

Файл /css/all.css содержит основные стили плюс все стили значков, которые вам понадобятся при использовании Font Awesome. Папка / webfonts содержит все файлы гарнитуры, на которые ссылается CSS выше и от которых зависит.

Скопируйте всю папку / webfonts и /css/all.css в stati c вашего проекта. каталог assets (или там, где вы предпочитаете хранить внешние ресурсы или материалы поставщика).

Добавьте ссылку на скопированный файл /css/all.css в каждый шаблон или страницу, которые вы хотите используйте Font Awesome на.

Затем сделайте это. 

@font-face{
  font-family:Font Awesome\ 5 Free;
  font-style:normal;
  font-weight:900;
  src:url('/assets/fontawesome-free-5.13.0-web/webfonts/fa-solid-900.eot');
  src:url('/assets/fontawesome-free-5.13.0-web/webfonts/fa-solid-900.eot?#iefix') format("embedded-opentype"),url('/assets/fontawesome-free-5.13.0-web/webfonts/fa-solid-900.woff2') format("woff2"),url('/assets/fontawesome-free-5.13.0-web/webfonts/fa-solid-900.woff') format("woff"),url('/assets/fontawesome-free-5.13.0-web/webfonts/fa-solid-900.ttf') format("truetype"),url('/assets/fontawesome-free-5.13.0-web/webfonts/fa-solid-900.svg#fontawesome') format("svg")
}
...