Атрибут стоп-цвета SVG
Опубликовано: 25 Февраля, 2022
Атрибут stop-color используется для указания цвета, который будет использоваться в конечной точке градиента. Это влияет только на элемент <stop>. Значение этого атрибута по умолчанию - «черный».
Синтаксис:
стоп-цвет = текущий цвет | цвет | icccolor
Значения атрибутов: этот атрибут принимает значения, указанные выше и описанные ниже:
- currentcolor: обозначает текущий цвет заливки.
- цвет: указывает значение цвета.
- icccolor: указывает цветовой профиль ICC.
Примеры ниже иллюстрируют использование атрибута «стоп-цвет».
Пример 1:
Выход:
Example 2:
HTML
<!DOCTYPE html><html> <body> <h1 style="color: green;"> GeeksforGeeks </h1> <svg height="200" width="200"> <defs> <linearGradient id="gradient"> <stop offset="20%" stop-color="rgb(20, 200, 0)" stop-opacity="0.4" /> <stop offset="80%" stop-color="rgb(200, 200, 0)" stop-opacity="0.4" /> </linearGradient> </defs> <rect width="100%" height="100%" fill="url(#gradient)" style="stroke: green;" /> <rect x="30" y="30" width="70%" height="70%" fill="url(#gradient)" /> <text fill="Green" y="100" font-size="25"> GeeksForGeeks </text> </svg></body> </html> |
Выход:
