This page was translated from English by the community. Learn more and join the MDN Web Docs community.
<g>
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since июль 2015 г..
SVG-элемент <g> служит контейнером для группировки других SVG-элементов.
Преобразования, примененные к элементу <g>, выполняются над его дочерними элементами, а его атрибуты наследуются ими. Он также может группировать несколько элементов, на которые позже можно будет ссылаться с помощью элемента <use>.
Пример
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>
[フレーム]
Контекст использования
| Категории | Элемент-контейнер, Структурный элемент |
|---|---|
| Разрешённый контент | Любое количество следующих элементов, в любом порядке: Элементы анимации Элементы описания Элементы фигуры Структурные элементы Элементы градиента <a>, <clipPath>, <filter>, <foreignObject>, <image>, <marker>, <mask>, <pattern>, <script>, <style>, <switch>, <text>, <view> |
Спецификации
| Specification |
|---|
| Scalable Vector Graphics (SVG) 2 # GElement |
Совместимость с браузерами
Enable JavaScript to view this browser compatibility table.