Чтобы изменить размер иконки с помощью CSS, можно использовать свойство font-size
. Если иконка представлена символом (например, шрифтом Font Awesome), то этот символ можно изменить, используя свойство content
.
Вот пример кода CSS, который изменит размер символьной иконки Font Awesome на 24 пикселя:
.icon {
font-family: 'Font Awesome 5 Free';
font-size: 24px;
content: "\f007";
}
В этом примере мы используем класс .icon
для выбора элемента, который должен содержать иконку. Затем мы задаем свойства font-family
и font-size
, чтобы определить шрифт для иконки и ее размер. Для изменения символа иконки мы используем свойство content
и устанавливаем значение символа, который соответствует иконке, которую мы хотим отображать.
Если вы используете иконку, представленную в виде изображения (например, PNG или SVG-файла), то для ее изменения можно использовать свойство width
и / или height
, чтобы задать нужные размеры:
.icon {
width: 48px;
height: 48px;
background-image: url('path/to/icon.png');
}
В этом примере мы задаем ширину и высоту иконки, а затем устанавливаем фоновое изображение, используя свойство background-image
. Размер изображения изменится на заданный.
2 комментария на «“Как изменить размер иконки CSS”»
Важные действия, потому что очень многие функции и ссылки (перейти, поделиться, подписаться и т.п.) удобно давать иконками. И информативно, и место здорово экономит.
все просто вышло