Для веб-сайта я хочу использовать иконки от fontawesome. Например, мне нужно использовать значок сердца:
работает:
<i class="fa fa-heart" aria-hidden="true"></i>
Значок доступен как заполненный вариант или только контур, и мне нужна только «контурная» версия значка. Чтобы получить версию схемы, просто измените соответствующий класс CSS, добавив «-o» следующим образом:
не работает:
<i class="fa fa-heart-o" aria-hidden="true"></i>
Но версия "-o" просто не отображается. На веб-сайте fontawesome объявлено множество значков, где можно добавить «-o», чтобы отображался только контур. Но ни один из них не отображается, когда я пробую. Нормальные иконки работают. Я также выполнил поиск объявления "-o" во всех загруженных файлах CSS, но ничего не нашел! Как будто они этого не реализовали.
Я не могу найти проблему. Мне кажется, что они «забыли» реализовать версии «-o» в последнем файле Fontawesome 5.0.4.
PS: Я добавил значки в свой проект, загрузив файл CSS «fontawesome-all.min.css». Используйте эту ссылку для поиска значков, например "сердце".
Как и запрошено, весь мой код:
<!DOCTYPE html>
<head>
<link href="http://127.0.0.1:8000/css/fontawesome-all.min.css" rel="stylesheet">
<link href="http://127.0.0.1:8000/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="card">
<div class="card-body">
<h6 class="card-title">Some Title</h6>
<!-- Stats -->
<p class="card-text font-weight-light">
<span class="mr-4"><i class="fa fa-comment" aria-hidden="true"></i>0</span>
<span class="mr-4"><i class="fa fa-heart" aria-hidden="true"></i>0</span>
<span><i class="fa fa-star" aria-hidden="true"></i>0</span>
</p>
</div>
</div>
</div>
</div>
</div>
<!-- Scripts -->
<script src="http://127.0.0.1:8000/js/jquery-3.2.1.min.js"></script>
<script src="http://127.0.0.1:8000/js/bootstrap.min.js"></script>
</body>
</html>
