Перевод не завершен. Пожалуйста, помогите перевести эту статью с английского.


Элемент <pattern> определяет графический объект, который может быть перерисован с повторяющимися координатами x и y («мозаичным»), чтобы покрыть область.

На ссылку <pattern> ссылаются атрибуты fill и / или stroke на других графических элементах , чтобы заполнить или обвести эти элементы указанным шаблоном. 
 
<svg viewBox="0 0 230 100" xmlns="http://www.w3.org/2000/svg">
  <defs>
    <pattern id="star" viewBox="0,0,10,10" width="10%" height="10%">
      <polygon points="0,0 2,5 0,10 5,8 10,10 8,5 10,0 5,2"/>
    </pattern>
  </defs>

  <circle cx="50"  cy="50" r="50" fill="url(#star)"/>
  <circle cx="180" cy="50" r="40" fill="none" stroke-width="20" stroke="url(#star)"/>
</svg>

Атрибуты

height
Этот атрибут определяет высоту плитки шаблона.
Value type: <length>|<percentage>; Default value: 0; Animatable: yes
href
Этот атрибут по умолчанию ссылается на пример шаблона для <pattern>
Value type: <URL>; Default value: none; Animatable: yes
patternContentUnits
Этот атрибут определяет систему координат содержимого <pattern>
Value type: userSpaceOnUse|objectBoundingBox; Default value: userSpaceOnUse; Animatable: yes

Сноска: Этот атрибут не действует, если в элементе <pattern> указан атрибут viewBox.

patternTransform
Этот атрибут содержит определение необязательного дополнительного преобразования из системы координат шаблона в целевую систему координат.
Value type: <transform-list>; Default value: none; Animatable: yes
patternUnits
Этот атрибут определяет систему координат для атрибутов x, y, width и height
Value type: userSpaceOnUse|objectBoundingBox; Default value: objectBoundingBox; Animatable: yes
preserveAspectRatio
Этот атрибут определяет, как фрагмент svg должен быть деформирован, если он встроен в контейнер с другим соотношением сторон.
Value type: (none| xMinYMin| xMidYMin| xMaxYMin| xMinYMid| xMidYMid| xMaxYMid| xMinYMax| xMidYMax| xMaxYMax) (meet|slice)? ; Default value: xMidYMid meet; Animatable: yes
viewBox
Этот атрибут определяет границы области просмотра SVG для фрагмента шаблона.
Value type: <list-of-numbers> ; Default value: none; Animatable: yes
width
Этот атрибут определяет ширину плитки шаблона.
Value type: <length>|<percentage> ; Default value: 0; Animatable: yes
x
Этот атрибут определяет смещение координаты x мозаичного изображения.
Value type: <length>|<percentage> ; Default value: 0; Animatable: yes
xlink:href Устарело SVG 2
Этот атрибут ссылается на пример шаблона, предоставляющего значения по умолчанию для атрибутов <pattern>.
Value type: <URL>; Default value: none; Animatable: yes

Сноска: Для браузеров, реализующих href, если заданы как href, так и xlink:href, xlink:href будет игнорироваться, используя только href.

y
Этот атрибут определяет смещение координат y мозаичного элемента.
Value type: <length>|<percentage> ; Default value: 0; Animatable: yes

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

Core Attributes
Most notably: id, tabindex
Styling Attributes
class, style
Conditional Processing Attributes
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
XLink Attributes
Most notably: xlink:title

Нотации

КатегорииКонтейнеры
Разрешённый контентЛюбое количество следующих элементов, в любом порядке:
Элементы анимации
Элементы описания
Фигуры
Структурные элементы
Градиенты
<a>, <altGlyphDef>, <clipPath>, <color-profile>, <cursor>, <filter>, <font>, <font-face>, <foreignObject>, <image>, <marker>, <mask>, <pattern>, <script>, <style>, <switch>, <text>, <view>

Характеристики

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

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

Update compatibility data on GitHub
КомпьютерыМобильные
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome для AndroidFirefox для AndroidOpera для AndroidSafari on iOSSamsung Internet
patternChrome Полная поддержка ДаEdge Полная поддержка ДаFirefox Полная поддержка ДаIE Полная поддержка ДаOpera Полная поддержка ДаSafari Полная поддержка 3WebView Android Полная поддержка ДаChrome Android Полная поддержка ДаFirefox Android Полная поддержка ДаOpera Android Полная поддержка ДаSafari iOS Полная поддержка 3Samsung Internet Android ?
heightChrome Полная поддержка ДаEdge Полная поддержка ДаFirefox Полная поддержка ДаIE Полная поддержка ДаOpera Полная поддержка ДаSafari Полная поддержка 3WebView Android Полная поддержка ДаChrome Android Полная поддержка ДаFirefox Android Полная поддержка ДаOpera Android Полная поддержка ДаSafari iOS Полная поддержка 3Samsung Internet Android ?
hrefChrome ? Edge ? Firefox ? IE ? Opera ? Safari ? WebView Android ? Chrome Android ? Firefox Android ? Opera Android ? Safari iOS ? Samsung Internet Android ?
patternContentUnitsChrome ? Edge ? Firefox ? IE ? Opera ? Safari Полная поддержка 3WebView Android ? Chrome Android ? Firefox Android ? Opera Android ? Safari iOS Полная поддержка 3Samsung Internet Android ?
patternTransformChrome ? Edge ? Firefox ? IE ? Opera ? Safari Полная поддержка 3WebView Android ? Chrome Android ? Firefox Android ? Opera Android ? Safari iOS Полная поддержка 3Samsung Internet Android ?
patternUnitsChrome ? Edge ? Firefox ? IE ? Opera ? Safari Полная поддержка 3WebView Android ? Chrome Android ? Firefox Android ? Opera Android ? Safari iOS Полная поддержка 3Samsung Internet Android ?
widthChrome Полная поддержка ДаEdge Полная поддержка ДаFirefox Полная поддержка ДаIE Полная поддержка ДаOpera Полная поддержка ДаSafari Полная поддержка 3WebView Android Полная поддержка ДаChrome Android Полная поддержка ДаFirefox Android Полная поддержка ДаOpera Android Полная поддержка ДаSafari iOS Полная поддержка 3Samsung Internet Android ?
xChrome Полная поддержка ДаEdge Полная поддержка ДаFirefox Полная поддержка ДаIE Полная поддержка ДаOpera Полная поддержка ДаSafari Полная поддержка 3WebView Android Полная поддержка ДаChrome Android Полная поддержка ДаFirefox Android Полная поддержка ДаOpera Android Полная поддержка ДаSafari iOS Полная поддержка 3Samsung Internet Android ?
xlink:href
Устаревшая
Chrome Полная поддержка ДаEdge Полная поддержка ДаFirefox Полная поддержка ДаIE Полная поддержка ДаOpera Полная поддержка ДаSafari Полная поддержка 3WebView Android Полная поддержка ДаChrome Android Полная поддержка ДаFirefox Android Полная поддержка ДаOpera Android Полная поддержка ДаSafari iOS Полная поддержка 3Samsung Internet Android ?
yChrome Полная поддержка ДаEdge Полная поддержка ДаFirefox Полная поддержка ДаIE Полная поддержка ДаOpera Полная поддержка ДаSafari Полная поддержка 3WebView Android Полная поддержка ДаChrome Android Полная поддержка ДаFirefox Android Полная поддержка ДаOpera Android Полная поддержка ДаSafari iOS Полная поддержка 3Samsung Internet Android ?

Легенда

Полная поддержка  
Полная поддержка
Совместимость неизвестна  
Совместимость неизвестна
Устаревшая. Не следует использовать в новых веб-сайтах
Устаревшая. Не следует использовать в новых веб-сайтах

Метки документа и участники

Метки: 
Внесли вклад в эту страницу: boxa6, mdnwebdocs-bot, warsan
Обновлялась последний раз: boxa6,