Справочник HTML & CSS

dir

Направление письма: слева направо или справа налево.

Синтаксис

<p dir="rtl">…</p>

Параметры

Параметр	Тип	Описание
dir	ltr \| rtl \| auto	Слева направо, справа налево или определить по тексту.

Примеры

Арабский текст справа налево:

<p dir="rtl" lang="ar">مرحبا بالعالم</p>
<p dir="ltr">Hello world</p>

Направление меняет и раскладку элементов:

<div dir="rtl" style="display: flex; gap: 8px;">
  <button>One</button><button>Two</button><button>Three</button>
</div>

Примечания

Для страниц на арабском и иврите dir="rtl" ставят у <html>. Направление задают именно атрибутом, а не CSS-свойством direction: это смысл текста, а не оформление. Логические свойства вроде margin-inline-start сами подстраиваются под направление.

См. также

lang — Язык содержимого элемента.
<bdi> — Изолирует текст с неизвестным направлением письма, чтобы он не путал порядок соседних символов.

В учебнике

Логические свойства — Свойства, которые зависят от направления текста, а не от сторон экрана — margin-inline, padding-block, inline-size, inset-inline и writing-mode.

Спасибо, что читаете!

dir