<g>

Baseline 已广泛支持

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

<g> SVG 元素是一个容器，用于组合其他 SVG 元素。

应用于 <g> 元素的变换将应用于其子元素，并且其属性将被其子元素继承。它还可以将多个元素组合起来，以便稍后使用 <use> 元素进行引用。

使用语境

分类	容器元素，结构元素
允许内容	可包含任意数量、任意顺序的下列元素动画元素描述性元素形状元素结构元素渐变元素 `<a>`, `<clipPath>`, `<filter>`, `<foreignObject>`, `<image>`, `<marker>`, `<mask>`, `<pattern>`, `<script>`, `<style>`, `<switch>`, `<text>`, `<view>`

属性

此元素仅包含全局属性。

DOM 接口

此元素实现了 SVGGElement 接口。

示例

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

html

<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
  <!-- Using g to inherit presentation attributes -->
  <g fill="white" stroke="green" stroke-width="5">
    <circle cx="40" cy="40" r="25" />
    <circle cx="60" cy="60" r="25" />
  </g>
</svg>

规范

规范
Scalable Vector Graphics (SVG) 2 # GElement

浏览器兼容性

帮助改进 MDN

了解如何贡献

此页面最后修改于 2025年6月6日，由 MDN 贡献者编辑。

在 GitHub 上查看此页面 • 报告此内容的问题