ry

Атрибут ry определяет радиус по оси y.

Вы можете использовать этот атрибут со следующими элементами SVG:

Пример

html

<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>, ry определяет радиус по оси y фигуры. При значении, меньшем или равном нулю, эллипс не будет отрисован.

Значение	<длина> \| <процент> \| `auto`
Значение по умолчанию	`auto`
Анимируемо	Да

Примечание: Радиус по оси y <ellipse> также можно определить с помощью свойства геометрии ry. Если задано в CSS, значение свойства ry переопределяет значение атрибута ry.

прямоугольник

Для <rect>, ry определяет радиус по оси y эллипса, используемого для скругления углов прямоугольника.

Способ интерпретации значения атрибута ry зависит от атрибута rx и ширины прямоугольника:

Если для атрибута ry указано корректное значение, а для rx — нет (или наоборот), браузер примет отсутствующее значение равным заданному.
Если ни для ry ни для rx нет корректного значения, браузер нарисует прямоугольник с прямыми углами.
Если ry больше половины ширины прямоугольника, браузер примет значение для ry как половину ширины прямоугольника.

Значение	<длина> \| <процент> \| `auto`
Значение по умолчанию	`auto`
Анимируемо	Да

Примечание: Вертикальную кривизну углов <rect> также можно определить с помощью свойства геометрии ry. Если задано в CSS, значение свойства ry переопределяет значение атрибута ry.

Спецификации

Спецификация
Scalable Vector Graphics (SVG) 2 # RY

© 2005–2024 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/ry