css властивість writing-mode

Властивість writing-mode визначає, чи текст буде розташований горизонтально чи вертикально.

правити

+ додати пораду чи нотатку

Синтаксис

writing-mode: horizontal-tb | vertical-rl | vertical-lr;

Властивість writing-mode може отримувати 3 значень:

horizontal-tb

Вміст блоку розташований горизонтально зліва направо, вертикально зверху вниз. Наступна горизонтальна лінія розташована під попередньою лінією.

автор: Svitlana

правити

vertical-rl

Вміст блоку розташований вертикально зверху вниз, горизонтально справа наліво. Наступна вертикальна лінія розташована ліворуч від попереднього рядка.

автор: Svitlana

правити

vertical-lr

Вміст блоку розташований вертикально зверху вниз, горизонтально зліва направо. Наступна вертикальна лінія розташована праворуч від попереднього рядка.

автор: Svitlana

правити

Переглядачі

Стаціонарні переглядачі Мобільні переглядачі

Підтримка: стаціонарні переглядачі

Переглядач
writing-mode	48.0 <br> 8.0 -webkit-	41.0	5.1 -webkit-	35.0 <br> 15.0 -o-	17.0	6.0 -ms-

Підтримка: мобільні переглядачі

Переглядач
writing-mode	3.0 -webkit-	41.0	5.1 -webkit-

Приклади

+ запропонувати свій приклад у пісочниці

<p class="v">Вертикальний рядок: згори донизу.</p>
<p>Звичайний горизонтальний абзац для порівняння.</p>

.v {
    writing-mode: vertical-rl;
    height: 200px;
}