<rect>

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020.

<rect> - это базовая SVG фигура, используется для отрисовки прямоугольников по координатам угла, длины и высоты прямоугольника. Также может использоваться для отрисовки прямоугольников со скруглёнными углами.

Контекст использования

Категория Простая фигура, Графический элемент
Разрешённое содержимое Любое количество указанных элементов в любом порядке: Элементы анимации » Элементы описания »
Нормативный документ SVG 1.1 (2ое издание)

Пример

Простой пример использования rect

xml
<?xml version="1.0"?>
<svg width="120" height="120"
     viewBox="0 0 120 120"
     xmlns="http://www.w3.org/2000/svg">

  <rect x="10" y="10" width="100" height="100"/>
</svg>

» rect-1.svg

<rect> со скруглёнными углами

xml
<?xml version="1.0"?>
<svg width="120" height="120"
     viewBox="0 0 120 120"
     xmlns="http://www.w3.org/2000/svg">

  <rect x="10" y="10"
        width="100" height="100"
        rx="15" ry="15"/>

</svg>

» rect-2.svg

Атрибуты

Специальные атрибуты

DOM Интерфейс

Данный элемент реализует интерфейс SVGRectElement.

Совместимость с браузерами

BCD tables only load in the browser

Смотрите также