🚀 Сегодня вам бесплатно доступен тренажёр по HTML и CSS.
Доступно в Baseline в статусе «Widely Available» с 2022-09-24
SVG позволяет задавать прозрачность элементов с помощью атрибутов fill-opacity
и stroke-opacity
. Первое управляет прозрачностью заливки фигуры, второе — линий контура. Эти свойства помогают создавать плавные градиенты, тени и эффекты прозрачности, делая графику более живой и многослойной.
Пример:
<svg width="200" height="200">
<circle cx="100" cy="100" r="80" fill="blue" fill-opacity="0.5" stroke="black" stroke-width="4" stroke-opacity="0.8" />
</svg>
Здесь fill-opacity
уменьшает прозрачность заливки, а stroke-opacity
— линий. Можно управлять ими как через CSS, так и напрямую в атрибутах элемента, чтобы добиться нужного эффекта прозрачности в SVG.
Больше обзоров веб-функций — в телеграм-канале HTML Academy.
Нашли ошибку или опечатку? Напишите нам.