Можно ли добавить границу вокруг значка font-size, используя css?

Question

Мне нужно изменить ширину рамки значка - fa-comment-o. Можно ли изменить размер границы с помощью css?

Answer 1

No, Вы не можете, так как это часть изображения.

Вы могли бы попытаться что-то поместить над ним.

Answer 2

Вы можете сделать это, уложив другие значки поверх значка fa-circle, чтобы они выглядели круглыми по форме. Также цвет можно инвертировать, используя класс fa-inverse. Вы можете разместить значки шрифта Awesome практически в любом месте, используя префикс CSS fa и имя значка. Шрифт Awesome предназначен для использования с встроенными элементами (нам нравится тег <i> для краткости, но использование <span> более семантически корректно).

примером и LEAR более abbout он http://fontawesome.io/examples/

Чтобы увеличить размеры иконок по отношению к их емкости, использовать фа-LG (33% увеличение), fa-2x, fa-3x, fa-4x или fa-5x классы.

<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 

Answer 3

Да, вы можете. Используйте текстовую тень:

.my-icon { 
    text-shadow: 0px 0px 3px #000; 
} 

Или же вы можете использовать WebKit текст инсульт помните работать только с Chrome и Safari

CSS-Tricks example

-webkit-text-fill-color: white; 
-webkit-text-stroke-width: 1px; 
-webkit-text-stroke-color: black; 

Answer 4

Границы построены в - по крайней мере, из v4.6.

«Используйте fa-border и fa-pull-right или fa-pull-left для удобных кавычек или значков статей».

<i class="fa fa-camera-retro fa-border"></i> fa-lg 

Перетяжка, стиль границы, цвет & больше может быть изменен в шрифте-удивительный файл CSS; поиск fa-border.

http://fontawesome.io/examples/#animated

Answer 5

На v5.0.6, шрифт Потрясающие использует svg s и s path рисовать свои иконки. Немного помогая инструменту Inspect Element, вот как я устанавливаю границы вокруг путей значков.

.fa-comment g g path { 
    stroke: black; 
    stroke-width: 10; 
}