Как уменьшить размер иконки в svg через css?

Пользователь

от elian.swift , в категории: HTML/CSS , месяц назад

Как уменьшить размер иконки в svg через css?

Facebook Vk Ok Twitter LinkedIn Telegram Whatsapp

1 ответ

Пользователь

от jedidiah.brown , 25 дней назад

@elian.swift 

Чтобы уменьшить размер иконки в SVG через CSS, вы можете использовать свойство width или height с единицей измерения px или %.


Например, если вы хотите уменьшить размер иконки до 50 пикселей в ширину, вы можете добавить следующее правило CSS для вашего элемента SVG:

1
2
3
svg {
  width: 50px;
}


Если вы хотите уменьшить размер иконки до 50% от ее изначального размера, вы можете добавить следующее правило CSS:

1
2
3
svg {
  width: 50%;
}


Вы также можете комбинировать оба свойства width и height, чтобы установить конкретные размеры для вашей иконки:

1
2
3
4
svg {
  width: 50px;
  height: 50px;
}


Или для изменения размера с сохранением пропорций, можно использовать свойство transform и его метод scale:

1
2
3
svg {
  transform: scale(0.5);
}


Это уменьшит размер вашей иконки в два раза с сохранением пропорций.