Задать вопрос

Не могу разобраться со шрифтовыми иконками?

Скачал с этого сайта комплект fontawesome.veliovgroup.com
Файлы со шрифтами поместил в D:\WebServer\OpenServer\domains\test\system\fonts\icon\
Файл с CSS поместил в D:\WebServer\OpenServer\domains\test\system\css файл fonts.css

<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html" charset="utf-8">
	<meta name="keywords" content="keywords, keywords, keywords, keywords, keywords, keywords">
	<meta name="description" content="description">
	<link rel="stylesheet" type="text/css" href="/system/css/main.css">
	<link rel="stylesheet" type="text/css" href="/system/css/fonts.css">
	<link rel="shortcut icon" type="image/x-icon" href="/system/img/favicon.ico">
	<title>Сайт</title>
</head>
<body>

<div class="head">
	<div class="header">
		<div class="logo">Сайт</div>
		<div class="nav">Сервисы Меню Профиль</div>
	</div>
</div>

<div class="content"><p><i class="icon-camera-retro icon-2x"></i> icon-camera-retro</p></div>

</body>
</html>


html, body {
	margin: 0;
	padding: 0;
	background-color: #eee;
	font-family: 'Regular', Arial, sans-serif;
	font-size: 20px;
	color: #5bc0de;
}

.head {
	height: 80px;
	width: 100%;
	background-color: #fff;
	border-bottom: 1px solid #ccc;
	margin-bottom: 20px;
}

.header {
	height: 80px;
	width: 1200px;
	margin: 0 auto;
}

.logo {
	float: left;
	font-size: 42px;
	line-height: 80px;
}

.nav {
	float: right;
	font-size: 24px;
	line-height: 80px;
}


@font-face {
  font-family: 'FontAwesome';
  src: url('/system/fonts/icon/fontawesome-webfont.eot?v=4.4.0');
  src: url('/system/fonts/icon/fontawesome-webfont.eot?#iefix&v=4.4.0') format('embedded-opentype'),
  url('/system/fonts/icon/fontawesome-webfont.woff2?v=4.4.0') format('woff2'),
  url('/system/fonts/icon/fontawesome-webfont.woff?v=4.4.0') format('woff'),
  url('/system/fonts/icon/fontawesome-webfont.ttf?v=4.4.0') format('truetype'),
  url('/system/fonts/icon/fontawesome-webfont.svg?v=4.4.0#fontawesomeregular') format('svg');
  font-weight: normal;
  font-style: normal;
}


Иконки не хотят появляться... В чем проблема?
  • Вопрос задан
  • 535 просмотров
Подписаться 1 Оценить 1 комментарий
Решения вопроса 2
max_cry
@max_cry
инопланетянин из Крыма
а потому что у них половина иконок не работает, вот почему, велиовгруп не очень сайт, возьми и подключи отсюда Тыц или так Ещё раз тыц
Ответ написан
Комментировать
LucasKane
@LucasKane
Front-end Developer
Не работает так как нет еще одного файла, а именно font-awesome.min.css в котором идет ссылка уже на файлы шрифта по пути ../fonts

Таки брал отсюда и все работает
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

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

Похожие вопросы
13 дек. 2024, в 22:23
1000 руб./за проект
13 дек. 2024, в 22:13
2000 руб./за проект