Вторник, 30 Сентября 2014 07:18

Font Awesome - шрифт с иконками

Written by 
Оцени эту запись
(4 Голоса)

Хочу немножко рассказать о интересном шрифте Font Awesome, который включает практически все иконки, которые нужны для большинства сайтом. Шрифт очень легко подключается, прост в использовании и открывает много возможностей :-)

 

Первым делом скажу, где его можно найти -- http://fortawesome.github.io/Font-Awesome/. Здесь можно посмотреть примеры всех иконок на странице Icons, посмотреть примеры подключения на Get Started и возможности использования на странице Examples.

 

А теперь предлагаю рассмотеть несколько примеров иконок:

 

  - fa fa-clock-o

 

  - fa fa-cab

 

  - fa fa-check-circle

 

  - fa fa-comments

 

 

Код выглядит очень просто -- к элементу добавляется класс fa с дополнением:

 

 

<i class="fa fa-comments"></i>

 

 

Если же к элементу применить стили, то можно изменить размер и цвет иконки:

 

 

<i class="fa fa-download" style="font-size: 1.5em; color: violet;">&nbsp;</i>

 

 

Результат:

 

  - fa fa-download

 

  - fa-folder

 

  - fa fa-key

 

  - fa fa-image

 

 

Есть также особые возможности от Font Awesome:

 

<i class="fa fa-spinner fa-spin">&nbsp;</i>

 

 

 

 

И другие:

 

 

  - fa fa-male fa-rotate-90

 

  - fa fa-pencil fa-lg

 

  - fa fa-question-circle fa-2x

 

  - fa fa-shopping-cart fa-3x

 

  - fa fa-share-alt fa-5x

 

 

Additional Info

Комментарии  

 
0 #2 website traffic tool 20.07.2017 12:11
How to drive traffic to your site [youtube]https://www.youtube.com/watch?v=86COMT8JE_c[/youtube]
this tool is incredible
 
 
0 #1 AlinaAma 20.11.2014 19:42
Спасибо, большое! Никак не получалось изменить стиль и только у вас нашла ответ!
 

You have no rights to post comments

верстка | CSS | верстка сайтов | HTML | верстальщик | блочная верстка | JavaScript | css верстка | профессиональная верстка сайтов