Задать вопрос
@n_bott
Junior web-developer
html

Почему не отображаются иконки Font Awesome?

Здравствуйте. Подключил Font Awesome через link в html по инструкции с сайта.

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Test</title>
	<link rel="stylesheet" style="text/css" href="all.css">
</head>
<body>
	<i class="fas fa-ad">
	<p>Lorem ipsum dolor sit.</p>
</body>
</html>


Сами же файлы расположены в одной папке:
5eb58ad74ae87226585251.png

При загрузке в Firefox отображается только это: 5eb5887b3bdc6734994849.png

В Safari: 5eb58feaf1cd0836353805.png

Но в Chrome он отображается: 5eb590024a2f6294794541.png
  • Вопрос задан
  • 598 просмотров
Комментировать
Подписаться 1 Простой Комментировать
Решения вопроса 1
develx
@develx Куратор тега CSS
Web developer
Только на сайте fontawesome тег i ещё и закрывается.
<i class="fab fa-accusoft"></i>
https://developer.mozilla.org/en-US/docs/Web/HTML/...
Tag omission
None, both the starting and ending tag are mandatory.

Если проверить разметку w3c валидатором, то увидите сразу ошибку. И браузеры могут неправильно трактовать невалидную вёрстку.
Ответ написан
7 комментариев
7 комментариев
Пригласить эксперта
Ответы на вопрос 1
@Coolam
Web-developer
Проверить нужно:
1. Правильность написания названия выбранного значка.
2. Лежит ли all.css там, где index.html
3. style не обязательно писать.
Проверьте, потыкайте, если не работает - отпишитесь.
Ответ написан
4 комментария
4 комментария
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы
Вакансии с Хабр Карьеры
Fullstack Developer под Wordpress
Future Search
от 90 000 до 150 000 ₽
WordPress-разработчик
div. • Ставрополь
от 50 000 до 120 000 ₽
JavaScript FullStack разработчик
Rocket • Смоленск
от 80 000 до 130 000 ₽
Ещё вакансии
Заказы с Хабр Фриланса
Телеграм бот
22 нояб. 2024, в 02:56
10000 руб./за проект
Перерисовать логотип в векторе
22 нояб. 2024, в 00:55
500 руб./за проект
Разработка алгоритма на python (Data engineering)
21 нояб. 2024, в 23:30
300000 руб./за проект
Ещё заказы