<ellipse>

Baseline 广泛可用 *

此特性已相当成熟，可在许多设备和浏览器版本上使用。自 ⁨2015 年 7 月⁩以来，各浏览器均已提供此特性。

* 此特性的某些部分可能存在不同级别的支持。

<ellipse> SVG 元素是 SVG 基本形状，用于根据中心坐标及其 x 和 y 半径创建椭圆。

注意：椭圆无法指定椭圆的确切方向（例如，如果您想绘制一个倾斜 45 度的椭圆），但可以使用 transform 属性对其进行旋转。

使用语境

分类	基本形状元素、图形元素、形状元素
允许内容	可包含任意数量、任意顺序的下列元素动画元素描述性元素

cx: 椭圆中心的 x 坐标。值类型：<length> | <percentage>；默认值：0；可动画：是
cy: 椭圆中心的 y 坐标。值类型：<length> | <percentage>；默认值：0；可动画：是
rx: 椭圆在 x 轴上的半径。值类型：auto | <length> | <percentage>；默认值：auto；可动画：是
ry: 椭圆在 y 轴上的半径。值类型：auto | <length> | <percentage>；默认值：auto；可动画：是
路径长度: 此属性允许指定路径的总长度（以用户单位）。值类型：<number>；默认值：无；可动画：是

注意：从 SVG2 开始，cx、cy、rx 和 ry 是几何属性，这意味着这些属性也可以用作该元素的 CSS 属性。

html,
body,
svg {
  height: 100%;
}

html

<svg viewBox="0 0 200 100" xmlns="http://www.w3.org/2000/svg">
  <ellipse cx="100" cy="50" rx="100" ry="50" />
</svg>

规范
Scalable Vector Graphics (SVG) 2 # EllipseElement

此页面最后修改于 ⁨2025 年 6 月 6 日⁩，由 MDN 贡献者进行。