Inter-Net.PRO

Font Awesome 5

  • 173 38
04 март 2018 14:24 - 04 март 2018 14:25 #1 от Inter-Net PRO
Inter-Net PRO создал тему "Font Awesome 5"
Вчера вышло обновление популярного иконочного шрифта Font Awesome - была выпущена версия 5.0.8
Признаюсь что до этого времени я игнорировал пятую версию и пользовался иконками версии 4.7.0

И вот я подробнее ознакомился с Font Awesome 5 и уже в ближайшее время планирую переходить на эту версию иконок, так как это новый подход к реализации иконок на сайте.


Font Awesome 5
Версия 5 была полностью с нуля переписана и переработана.

Стоит отметит что Font Awesome 5 сделан в двух версиях - платная и бесплатная.
Иконки бесплатной версии можно посмотреть по ссылке: fontawesome.com/icons?d=gallery&m=free


Подключение
Самый простой и рекомендуемый метод подключения - это использование бесплатного CDN для Font Awesome
Используйте Font Awesome CDN для подключения кешированной версии Font Awesome JS со всеми её функциями.
Вставьте код указанный ниже в пределах секции <head>
<script defer src="https://use.fontawesome.com/releases/v5.0.8/js/all.js"></script>
Если у вас есть сомнения куда конкретно вставлять код, то добавьте его перед закрывающимся тегом </head>


Изменения
Особенностью пятой версии является то, что все иконки выполнены в формате SVG с реализацией через JavaScript. Это во много раз уменьшило вес шрифта, что положительно для скорости загрузки сайта.
SVG с JavaScript заменяет теги <i> (и другие), на теги <svg> с соответствующим набором критериев.

Так же стоит отметить, что в новой версии css-префикс fa был заменён на префиксы fas и fab
Теперь иконки внедряются вот так:
<i class="fas fa-home"></i>

Инструкция по обновлению fontawesome.com/how-to-use/upgrading-from-4

Авторизация

Войти через соцсети: