Unicode символы для шрифта удивительный «поиск» не появляется после обновления Font Awesome - PullRequest
0 голосов
/ 16 мая 2018

Я использовал шрифт awesomes 'search' font

<i class="fas fa-search"></i>

символы Юникода

F002

в моем поле поиска заполнитель, как это

<input id="navbarSearchField" type="text" class="form-control searchInputsHeight" style="font-family:Arial, FontAwesome" placeholder="&#xf002;  Location" aria-describedby="navbarDate" />

и все работало нормально, пока я не обновил Font Awesome 5.0.13 со старой версии 4.4

При просмотре сайта Font Awesome символы Юникода все те же.

Так что мне интересно, есть ли какой-то файл, который я пропустил при загрузке шрифтов, или я неправильно его реализую?

Ответы [ 3 ]

0 голосов
/ 16 мая 2018

<input id="navbarSearchField" class="fas" type="text" placeholder="&#xf002;  Location" aria-describedby="navbarDate" />
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.13/css/all.css" integrity="sha384-DNOHZ68U8hZfKXOrtjWvjxusGo9WQnrNx2sqG0tfsghAvtVlRW3tvkXWZh58N9jp" crossorigin="anonymous">

Просто добавьте класс fa или fas к входу:

<input id="navbarSearchField" class="fa" type="text" placeholder="&#xf002;  Location" aria-describedby="navbarDate" />

Демо: http://jsfiddle.net/GCu2D/3601/

0 голосов
/ 16 мая 2018

Я получил его на работу.Вот что я сделал.

<input id="navbarSearchField" type="text" class="form-control searchInputsHeight" style="font-family:Arial, 'Font Awesome 5 Free'; font-weight: 600; color: #777; font-size: 20px;" placeholder="&#xf002;  Location" aria-describedby="navbarDate" />

Обратите внимание на одинарные кавычки вокруг семейства шрифтов 'Font Awesome 5 Free'.Если я не использовал одинарные кавычки, это работало с классом fa, но использовал семейство шрифтов Font Awesome, теперь он использует мой шрифт.«Круговой» без использования класса fa.Кроме того, я должен был добавить шрифт-вес: 600, иначе он не появится!Вес шрифта объясняется в документах FA онлайн

0 голосов
/ 16 мая 2018

Я думаю, что это очень интересный вопрос, и я уверен, что это не на 100% идеальное решение, но я нашел этот выпуск Github , где, как говорят, вам также нужно установить font-weight: 900 для твердого шрифта Awesome Icons. Также font-family немного изменился, как упоминалось в комментариях. Пожалуйста, взгляните на фрагмент ниже, я не уверен, что вы можете "отменить" текст после значка.

<link href="https://use.fontawesome.com/releases/v5.0.13/css/all.css" rel="stylesheet"/>

<input id="navbarSearchField" 
       type="text" 
       class="form-control searchInputsHeight" 
       style="font-family: Arial, Font Awesome\ 5 Free; font-weight: 900;" 
       placeholder="&#xf002 Location" 
       aria-describedby="navbarDate" 
/>

Похоже, вам не нужно устанавливать конкретный вес шрифта с помощью "Regular" Icon Pack от FA, но, к сожалению, это часть FA Pro, которую вам придется купить.

...