direction

Базовая поддержка Широко доступно

Эта возможность хорошо зарекомендовала себя и работает во многих устройствах и версиях браузеров. Она доступна во всех браузерах с ⁨июля 2015⁩ года.

Атрибут direction задаёт направление базовой строки для элемента <text> или <tspan>. Он определяет начальную и конечную точки текстовой строки, используемые свойствами text-anchor и inline-size. Он также может влиять на направление расположения символов, если значением свойства unicode-bidi является embed или bidi-override.

Он применяется только к глифам, ориентированным перпендикулярно направлению базовой строки. Сюда относится обычный случай горизонтально ориентированного латинского или арабского текста, а также узкие латинские или арабские символы, повёрнутые на 90 градусов по часовой стрелке относительно направления базовой строки сверху вниз.

Во многих случаях алгоритм двунаправленного текста Unicode автоматически обеспечивает нужный результат, поэтому в таких случаях этот атрибут указывать не нужно. В других случаях, например при использовании языков с письмом справа налево, может быть достаточно добавить атрибут direction к внешнему элементу <svg>, чтобы это направление наследовалось всеми текстовыми элементами:

Примечание: У атрибута direction, используемого для задания стиля представления, есть соответствующее свойство CSS: direction. Если указаны оба варианта, приоритет имеет свойство CSS.

Этот атрибут можно использовать со следующими элементами SVG:

Пример

<svg
  viewBox="0 0 600 72"
  xmlns="http://www.w3.org/2000/svg"
  direction="rtl"
  lang="fa">
  <text x="300" y="50" text-anchor="middle" font-size="36">
    داستان SVG 1.1 SE طولا ني است.
  </text>
</svg>

Примечания по использованию

Значение	`ltr` \| `rtl`
Значение по умолчанию	`ltr`
Анимируемый	Да

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

Спецификация
Режимы письма CSS, уровень 4> # direction>
Масштабируемая векторная графика (SVG) 2> # DirectionProperty>

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

	Настольные компьютеры					Мобильные устройства
	Chrome	Edge	Firefox	Opera	Safari	Chrome для Android	Firefox для Android	Opera для Android	Safari для iOS	Samsung Internet	WebView для Android	WebView для iOS
`direction`	2	12	1	9.2	1	18	4	10.1	1	1.0	4.4	1

См. также

Свойство CSS direction

© 2005–2025 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/SVG/Reference/Attribute/direction