<path>

Элемент <path> является общим элементом для описания фигуры. Все базовые фигуры могут быть созданы с помощью элемента path.

<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
  <path d="M 10,30
           A 20,20 0,0,1 50,30
           A 20,20 0,0,1 90,30
           Q 90,60 50,90
           Q 10,60 10,30 z"/>
</svg>

Атрибуты

d
Этот атрибут определяет форму.
Тип значения: <string> ; Значеие по умолчанию: ''; Анимирование: Да
pathLength
Этот атрибут позволяет указывать общую длину в пользовательских единицах.
Тип значения: <number> ; Значеие по умолчанию:нет; Анимирование: Да

Глобальные атрибуты

Атрибуты ядра
Most notably: id, tabindex
Атрибуты стиля
class, style
Атрибуты условной обработки
Most notably: requiredExtensions, systemLanguage
Атрибуты событий
Атрибуты глобальных событий, Атрибуты графических событий
Presentation Attributes
Most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility
ARIA атрибуты
aria-activedescendant, aria-atomic, aria-autocomplete, aria-busy, aria-checked, aria-colcount, aria-colindex, aria-colspan, aria-controls, aria-current, aria-describedby, aria-details, aria-disabled, aria-dropeffect, aria-errormessage, aria-expanded, aria-flowto, aria-grabbed, aria-haspopup, aria-hidden, aria-invalid, aria-keyshortcuts, aria-label, aria-labelledby, aria-level, aria-live, aria-modal, aria-multiline, aria-multiselectable, aria-orientation, aria-owns, aria-placeholder, aria-posinset, aria-pressed, aria-readonly, aria-relevant, aria-required, aria-roledescription, aria-rowcount, aria-rowindex, aria-rowspan, aria-selected, aria-setsize, aria-sort, aria-valuemax, aria-valuemin, aria-valuenow, aria-valuetext, role

Использование

КатегорииГрафические элементы, Фигура
Разрешённый контентЛюбое количество следующих элементов, в любом порядке:
Элементы анимации
Элементы описания

Спецификация

Характеристики Статус Коммент
SVG Paths
Определение '<path>' в этой спецификации.
Рабочий черновик
Scalable Vector Graphics (SVG) 2
Определение '<path>' в этой спецификации.
Кандидат в рекомендации
Scalable Vector Graphics (SVG) 1.1 (Second Edition)
Определение '<path>' в этой спецификации.
Рекомендация Initial definition

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

div class="hidden">Таблица совместимости на этой странице генерируется из структурированных данных. Если вы хотите внести свой вклад в эти данные, перейдите на https://github.com/mdn/browser-compat-data и отправьте pull request на изменение.

Update compatibility data on GitHub
КомпьютерыМобильные
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome для AndroidFirefox для AndroidOpera для AndroidSafari on iOSSamsung Internet
pathChrome Полная поддержка 1Edge Полная поддержка ДаFirefox Полная поддержка 1.5IE Полная поддержка 9Opera Полная поддержка 8Safari Полная поддержка 3WebView Android Полная поддержка 3Chrome Android Полная поддержка ДаFirefox Android Полная поддержка 4Opera Android Полная поддержка ДаSafari iOS Полная поддержка 3Samsung Internet Android Полная поддержка Да
dChrome Полная поддержка 1Edge Полная поддержка ДаFirefox Полная поддержка 1.5IE Полная поддержка 9Opera Полная поддержка 8Safari Полная поддержка 3WebView Android Полная поддержка 3Chrome Android Полная поддержка ДаFirefox Android Полная поддержка 4Opera Android Полная поддержка ДаSafari iOS Полная поддержка 3Samsung Internet Android Полная поддержка Да

Легенда

Полная поддержка  
Полная поддержка

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