ry
示例
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 半径。如果值小于或等于零,则椭圆将不会绘制。
| 值 |
<length> | <percentage> | auto |
|---|---|
| 默认值 | auto |
| 可动画 | 是 |
注意:<ellipse> 的 y 半径也可以使用 ry 几何属性 定义。如果在 CSS 中设置,则 ry 属性值会覆盖 ry 属性值。
矩形
对于 <rect>,ry 定义用于将矩形角圆角的椭圆的 y 轴半径。
ry 属性值的解释方式取决于 rx 属性和矩形的宽度。
- 如果为
ry提供了正确指定的数值,但没有为rx提供(或相反),则浏览器将认为缺少的值等于已定义的值。 - 如果
ry和rx都没有正确指定的数值,则浏览器将绘制一个具有方形角的矩形。 - 如果
ry大于矩形宽度的一半,则浏览器将认为ry的值为矩形宽度的一半。
| 值 |
<length> | <percentage> | auto |
|---|---|
| 默认值 | auto |
| 可动画 | 是 |
注意:<rect> 角的垂直曲线也可以使用 ry 几何属性 定义。如果在 CSS 中设置,则 ry 属性值会覆盖 ry 属性值。
规范
| 规范 |
|---|
| 可缩放矢量图形 (SVG) 2 # RY |