writing-mode

Baseline Widely available *

This feature is well established and works across many devices and browser versions. It’s been available across browsers since ⁨март 2017 г.⁩.

* Some parts of this feature may have varying levels of support.

Экспериментальная возможность: Это экспериментальная технология
Так как спецификация этой технологии ещё не стабилизировалась, смотрите таблицу совместимости по поводу использования в различных браузерах. Также заметьте, что синтаксис и поведение экспериментальной технологии может измениться в будущих версиях браузеров, вслед за изменениями спецификации.

Summary

Свойство writing-mode устанавливает горизонтальное или вертикальное положение текста также как и направление блока.

Свойство определяет направление потока блока, в каком направлении складываются контейнеры уровня блока и направление в котором инлайновый контент находится в родительском блоке. Также свойство writing-mode определяет порядок контента блочного уровня.

Начальное значение	`horizontal-tb`
Применяется к	все элементы, кроме групп табличных строк, групп табличных столбцов, табличных строк и табличных колонок
Наследуется	да
Обработка значения	как указано
Animation type	Not animatable

Синтаксис

css

/* Keyword values */
writing-mode: horizontal-tb;
writing-mode: horizontal-bt;
writing-mode: vertical-rl;
writing-mode: vertical-lr;
/* Global values */
writing-mode: inherit;
writing-mode: initial;
writing-mode: unset;

Значения

horizontal-tb: Content flows horizontally from left to right, vertically from top to bottom. The next horizontal line is positioned below the previous line.
horizontal-bt: Content flows horizontally from left to right, vertically from bottom to top. The next horizontal line is positioned above the previous line.
vertical-rl: Content flows vertically from top to bottom, horizontally from right to left. The next vertical line is positioned to the left of the previous line.
vertical-lr: Content flows vertically from top to bottom, horizontally from left to right. The next vertical line is positioned to the right of the previous line.
lr Устарело: Deprecated except for SVG1 documents. For CSS, use horizontal-tb.
lr-tb Устарело: Deprecated except for SVG1 documents. For CSS, use horizontal-tb.
rl Устарело: Deprecated except for SVG1 documents. For CSS, use horizontal-tb.
tb Устарело: Deprecated except for SVG1 documents. For CSS, use vertical-rl.
tb-rl Устарело: Deprecated except for SVG1 documents. For CSS, use vertical-rl.

Formal syntax

writing-mode = 
 horizontal-tb | 
 vertical-rl | 
 vertical-lr | 
 sideways-rl | 
 sideways-lr

Пример

html

<p class="exampleText">Example text</p>

css

.exampleText {
 writing-mode: vertical-rl;
}

[フレーム]

Specification

Specification
CSS Writing Modes Level 4 # block-flow
Scalable Vector Graphics (SVG) 2 # WritingModeProperty

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

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

Help improve MDN

Learn how to contribute

This page was last modified on ⁨4 мая 2024 г.⁩ by MDN contributors.

View this page on GitHub • Report a problem with this content