Шрифт Font Awesome
При создании уникального образа своего сайта мы пользуемся большим количеством инструментов. Но и в этом многообразии выделяются какой-то базовый набор для работы. Наполняемость этого набора зависит от специфики выполняемых функций и от компетентности разработчика.
Красивое оформление сайта зависит от правильно выбранной стилистики. Какой инструмент нам в этом поможет? Стоит обратить свое внимание на шрифтовые иконки Font Awesome. Данный шрифт самый популярный из всех ему подобных и используется практически везде. По этому навык работы с этими иконками является базовым.
Принцип работы со шрифтовыми иконками Font Awesome:
1.Скачать файл со шрифтом на официальном сайте.
2. Скопировать папку font-awesome в папку вашего сайта
3. Идём в исходный код нашей странички и подключаем файл в качестве обычного CSS.
<link rel="stylesheet" href="path/to/font-awesome/css/font-awesome.min.css">
Таким образом у вас на странице подключен теперь шрифт Font Awesome.
Для использования доступно 675 иконок. Некоторые из них анимированные. Работа облегчена тем, что иконки разработаны как шрифт, и для их эксплуатации подходят все стандартные приемы для работы со шрифтами.
Вы можете менять размер и цвет иконок, как всех, так и только некоторых. При этом качество изображения не поменяется, так как иконки шрифтовые и в их основе использован вектор.
На сайте Font Awesome в разделе примеры находится множество вариантов использования шрифтовых иконок. Для примера представлена возможность изменения размера иконок без использования CSS.
<i class="fa fa-camera-retro fa-lg"></i> fa-lg
<i class="fa fa-camera-retro fa-2x"></i> fa-2x
<i class="fa fa-camera-retro fa-3x"></i> fa-3x
<i class="fa fa-camera-retro fa-4x"></i> fa-4x
<i class="fa fa-camera-retro fa-5x"></i> fa-5x
Таким способом одинаковые иконки на странице будут иметь разный размер.
Шрифтовые иконки используются повсеместно и являются одним из главных инструментов при оформлении страницы.
Ссылка для скачивания доступна только авторизованным пользователям, пожалуйста пройдите регистрацию.
Это займёт не более минуты. Не волнуйтесь, мы не спамим!
Информация
Посетители, находящиеся в группе Гости, не могут оставлять комментарии к данной публикации.
Облако тегов
bootstrap Bootstrap CSS CSS3 DLE dle fruit farm html html шаблон html5 HTML5 Payeer PNG PSD wap Wordpress Скрипт удвоителя адаптивный адаптивный шаблон бонусник дизайн игровой хостинг иконки лендинг меню модуль панель портфолио сайт скрипт скрипт фермы текстура удвоитель удвоитель Payeer ферма фон фруктовая ферма хак шаблон экономическая игра
Заголовок верхнего уровня в HTML