fill-opacity

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2020.

We’d love to hear your thoughts on the next set of proposals for the JavaScript language. You can find a description of the proposals here.
Please take two minutes to fill out our short survey.

« Справочник SVG атрибутов

Этот атрибут определяет прозрачность цвета заполнения содержимого элемента.

Контекст использования

Категория Атрибут оформления
Значение <opacity-value> | inherit
Предустановленное значение 1
Анимируемый Да
Спецификация SVG 1.1 (2nd Edition)

Примеры

SVG

html
<svg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
  <circle cx="100" cy="100" r="100" />
</svg>
<svg viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
  <circle cx="100" cy="100" r="100" fill-opacity="0.25" />
</svg>

результат

Элементы

Следующие группы элементов могут быть использованы с атрибутом fill-opacity:

Смотрите также