This page was translated from English by the community. Learn more and join the MDN Web Docs community.
ry
Атрибут ry определяет радиус круга по оси y.
Пример
html,
body,
svg {
height: 100%;
}
<svg viewBox="0 0 300 200" xmlns="http://www.w3.org/2000/svg">
<ellipse cx="50" cy="50" ry="0" rx="25" />
<ellipse cx="150" cy="50" ry="25" rx="25" />
<ellipse cx="250" cy="50" ry="50" rx="25" />
<rect x="20" y="120" width="60" height="60" ry="0" rx="15" />
<rect x="120" y="120" width="60" height="60" ry="15" rx="15" />
<rect x="220" y="120" width="60" height="60" ry="150" rx="15" />
</svg>
ellipse
Для элемента <ellipse>, ry определяет радиус фигуры по оси y. Если значение меньше или равно 0, эллипс не будет нарисован вообще.
| Значение | <length> | <percentage> | auto |
|---|---|
| Значение по умолчанию | auto |
| Анимируемый | Да |
Примечание: Начиная с SVG2, ry - свойство геометрии(Geometry Property). Это означает, что атрибут также можно использовать как свойство CSS для эллипсов.
rect
Для <rect>, ry определяет радиус эллипса по оси x, используется для скругления углов прямоугольника.
Способ интерпретации значения атрибута ry зависит как от атрибута rx , так и от ширины прямоугольника:
- Если правильно задано значение для
ry, но не дляrx(или наоборот), то браузер сочтёт отсутствующее значение равным указанному. - Если ни
ry, ниrxне имеют правильно указанного значения, браузер нарисует прямоугольник с квадратными углами. - Если
ryбольше половины ширины прямоугольника, то браузер будет считать значениеryполовиной ширины прямоугольника.
| Значение | <length> | <percentage> | auto |
|---|---|
| Значение по умолчанию | auto |
| Анимируемый | Да |
Примечание: Начиная с SVG2, ry - свойство геометрии(Geometry Property). Это означает, что атрибут также можно использовать как свойство CSS для rect.
Спецификации
| Specification |
|---|
| Scalable Vector Graphics (SVG) 2> # RY> |