Ручное подключение шрифта через HTML

Поддержка
1

Привет :slight_smile:
Я пытаюсь добавить следующие два символа: :heart: и :white_check_mark:, используя HTML.
Насколько я понимаю, это шрифты из Font Awesome, поэтому я попробовал вставить:

<i class="fa fa-heart-o"></i>

Но шрифт не отображается:

image

Добавляется элемент размером 0x0. Как правильно добавить шрифт?

2

Попробовали ли вы добавить собственный CSS, чтобы принудительно задать размер?

3

Почему бы не использовать Unicode-эмодзи?

4

Это старый формат. С ноября 2018 года мы перешли на SVG-иконки для FontAwesome: теперь мы используем синтаксис SVG вместо элементов i для иконок шрифта.

5

Мне удалось заставить это работать с Unicode-эмодзи, но, думаю, это не решение по двум причинам:

  1. Согласованность с другими эмодзи. Например, если я решу изменить тип эмодзи с Windows 10 на Apple, мне придётся внести изменения и в плагине.
  2. Не уверен, поддерживают ли старые браузеры такие шрифты/Unicode.

Но, думаю, это лучше, чем использовать SVG, если говорить об эффективности.

Не могли бы вы показать небольшой пример того, как это использовать?

6

Если вы добавляете эти иконки в плагин, в ядре есть инструменты для их использования как в Ruby, так и в Ember. Для начала ознакомьтесь с материалами по ссылке: Introducing Font Awesome 5 and SVG icons.