Как настроить смартфоны и ПК. Информационный портал

Направление вывода текста: свойства 'direction' и 'unicode-bidi'.

В европейских языках чтение текста происходит слева направо, в то время как есть языки, где текст читается справа налево. При смешении в одном документе разных по написанию символов (русского с ивритом, к примеру) в системе юникод, их направление определяется браузером из характеристик и содержимого текста. Свойства unicode-bidi и direction задают, как должен располагаться текст используемого языка.

Краткая информация

Обозначения

Описание Пример
<тип> Указывает тип значения. <размер>
A && B Значения должны выводиться в указанном порядке. <размер> && <цвет>
A | B Указывает, что надо выбрать только одно значение из предложенных (A или B). normal | small-caps
A || B Каждое значение может использоваться самостоятельно или совместно с другими в произвольном порядке. width || count
Группирует значения. [ crop || cross ]
* Повторять ноль или больше раз. [,<время>]*
+ Повторять один или больше раз. <число>+
? Указанный тип, слово или группа не является обязательным. inset?
{A, B} Повторять не менее A, но не более B раз. <радиус>{1,4}
# Повторять один или больше раз через запятую. <время>#
×

Значения

normal Браузер самостоятельно определяет, как ему следует отображать текст на основе символов юникода. embed Переопределяет параметры текста, располагая его, как указано в свойстве direction . bidi-override Аналогичен embed , но при этом также меняется порядок символов в тексте, подчиняясь значению direction .

Песочница

Винни-Пух был всегда не прочь немного подкрепиться, в особенности часов в одиннадцать утра, потому что в это время завтрак уже давно окончился, а обед ещё и не думал начинаться. И, конечно, он страшно обрадовался, увидев, что Кролик достаёт чашки и тарелки.

div { direction: rtl; unicode-bidi: normal ; }

Пример

unicode-bidi

А роза упала на лапу Азора.

У лип Леша нашел пилу.

И городу дорог огород у дороги.

Уж я веники не вяжу.

Аргентина манит негра.

Он дивен, палиндром - и ни морд, ни лап не видно.

Но невидим архангел, мороз узором лег на храм и дивен он.

Леша на полке клопа нашел.

Я не стар брат Сеня.

Результат данного примера показан на рис. 1. Поскольку используется значение bidi-override свойства unicode-bidi , то порядок символов в тексте меняется на обратный. А именно на тот, что указан свойством direction . Заметьте, что текст располагается по правому краю окна, точка в предложении слева от текста.

Рис. 1. Результат использования unicode-bidi и direction

Объектная модель

Объект .style.unicodeBidi

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

Каждая спецификация проходит несколько стадий одобрения.

  • Recommendation (Рекомендация ) - спецификация одобрена W3C и рекомендована как стандарт.
  • Candidate Recommendation (Возможная рекомендация ) - группа, отвечающая за стандарт, удовлетворена, как он соответствует своим целям, но требуется помощь сообщества разработчиков по реализации стандарта.
  • Proposed Recommendation (Предлагаемая рекомендация ) - на этом этапе документ представлен на рассмотрение Консультативного совета W3C для окончательного утверждения.
  • Working Draft (Рабочий проект ) - более зрелая версия черновика после обсуждения и внесения поправок для рассмотрения сообществом.
  • Editor"s draft (Редакторский черновик ) - черновая версия стандарта после внесения правок редакторами проекта.
  • Draft (Черновик спецификации ) - первая черновая версия стандарта.
×

Символы в некоторых видах письма записываются справа налево. В некоторых документах, особенно на арабском и еврейском, и в некоторых контекстах смешивания языков текст в одиночном (визуально отображаемом) блоке может появляться со смешанным направлением письма. Этот феномен называется bidirectionality\двунаправленность , или сокращённо - "bidi" .

Стандарт Unicode ( , раздел 3.11) даёт сложный алгоритм определения направления текста. Этот алгоритм состоит из подразумеваемой части, базирующейся на свойствах символов, а также явной, контролирующей внедрения и переопределения. CSS2 обращается к этому алгоритму для достижения соответствующего двунаправленного отображения. Свойства "direction" и "unicode-bidi" позволяют авторам специфицировать, как элементы и атрибуты языка документа отображаются в этот алгоритм .

Если документ содержит символы справа-налево и если ПА отображает эти символы соответствующими глифами (а не произвольно замещающими, такими как знак кавычки, 16-ричный код, чёрный бокс и т.п.), то ПА обязан применять двунаправленный алгоритм . Это кажущееся односторонним требование отражает тот факт, что, хотя не каждый еврейский или арабский документ содержит текст разных направлений, велика вероятность того, что эти документы могут содержать текст слева-направо (например, числа, текст из других языков).

Поскольку направление текста зависит от структуры и семантики документа, эти свойства должны в большинстве случаев использоваться только дизайнерами описания типа документа (ОТД) или авторами специальных документов. Если таблица стилей по умолчанию специфицирует эти свойства, то авторы и пользователи не должны специфицировать правила для их переопределения. Типичным исключением будет переопределение bidi-поведения в ПА, если этот ПА производит транслитерацию идиша (обычно записанного буквами иврита) на латиницу по запросу пользователя.

Спецификация HTML 4.0 ( , раздел 8.2) определяет двунаправленное поведение для элементов HTML . Соответствующие HTML ПАгенты могут поэтому игнорировать свойства "direction" и "unicode-bidi" в авторских и пользовательских таблицах стилей. Правила таблиц стилей, которые необходимо применять для bidi-поведения и которые специфицированы в "Приложение F. Индекс свойств" , даны в "Приложение A. Образец таблицы стиля для HTML 4.0" . Спецификация HTML 4.0 содержит также дополнительную информацию о вопросах двунаправленности.

"direction"

Значение : ltr | rtl | inherit

Начальное: ltr

Наследуется: да

Процентное: N/A

Носитель: визуальный

Это свойство специфицирует базовое направление письма блоков и направление внедрений и переопределений (см. "unicode-bidi") для двунаправленного алгоритма Unicode. Дополнительно оно специфицирует направление для столбца таблицы, направление горизонтального переполнения и позицию неполной последней строки блока в том случае, если "text-align: justify ".

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

Справа налево.

Чтобы свойство "direction" работало в элементах инлайн-уровня, значение свойства "unicode-bidi" обязано быть "embed" или "override".

Примечание. Свойство "direction" , специфицированное для элементов столбца таблицы, не наследуется ячейками столбца, поскольку столбцы не существуют в дереве документа. Таким образом, CSS не может использовать правила наследования атрибута "dir", описанные в "Приложение F. Индекс свойств" , в разделе 11.3.2.1.

"unicode-bidi"

Значение : normal | embed | bidi-override | inherit

Начальное: normal

Применяется: ко всем элементам, но см. текст

Наследуется: нет

Процентное: N/A

Носитель: визуальный

Значения этого свойства имеют следующий смысл:

Элемент не открывает дополнительный уровень внедрения относительно двунаправленного алгоритма. Для элементов инлайн-уровня неявное переупорядочивание работает вне границ элемента.

Если элемент - инлайн-уровня, это значение открывает дополнительный уровень внедрения относительно двунаправленного алгоритма. Направление в этом уровне внедрения задаётся свойством "direction" . Внутри элемента переупорядочивание выполняется неявно. Это соответствует дополнению LRE (U+202A; для "direction: ltr") или RLE (U+202B; для "direction: rtl") в начале элемента и PDF (U+202C) в конце элемента.

bidi-override

Если элемент - уровня блока или инлайн и содержит только элементы инлайн-уровня, это значение создаёт переопределение . Это означает, что внутри элемента переупорядочивание выполняется строго в соответствии со свойством "direction" ; неявная часть двунаправленного алгоритма игнорируется . Это соответствует дополнению LRO (U+202D; для "direction: ltr") или RLO (U+202E; для "direction: rtl") в начале элемента и a PDF (U+202C) в конце элемента.

Окончательный порядок символов в каждом элементе уровня блока - такой, как если бы bidi-код управления был добавлен так, как описано выше, разметка была бы вырезана, а результирующая последовательность символов - передана в двунаправленный алгоритм Unicode в обычный текст, который производил бы те же самые разрывы строк, что и стилизованный текст. В этом процессе нетекстуальные объекты, такие как изображения, рассматриваются как нейтральные символы, если только их свойство "unicode-bidi" не имеет значений, отличных от "normal", тогда они рассматриваются как полужирные (strong) символы в "direction" , специфицированном для элемента.

Пожалуйста, обратите внимание, что, для того чтобы иметь возможность разместить инлайн-боксы в одном направлении (все слева-направо или все справа-налево), может понадобиться создание дополнительных инлайн-боксов (включая анонимные инлайн-боксы ), и понадобится разделить и переупорядочить некоторые инлайн-боксы до размещения.

Поскольку алгоритм Unicode имеет предел - 15 уровней внедрения, лучше не использовать "unicode-bidi" со значениями, отличными от "normal", если отсутствуют подходящие. Значение " inherit " должно использоваться особенно осторожно. Однако для элементов, которые обычно предполагается отображать как блоки, установка "unicode-bidi: embed" предпочтительнее для удержания элементов вместе в том случае, когда дисплей изменяется на инлайн (см. пример ниже).

В следующем примере показан документ XML с двунаправленным текстом. Он иллюстрирует важный принцип дизайна: дизайнеры ОТД должны принимать в расчёт bidi и в собственно языке (элементы и атрибуты), и в сопровождающих таблицах стилей. Таблицы стилей должны быть разработаны так, чтобы правила bidi были отделены от других правил стиля. Правила bidi не должны переопределяться другими таблицами стилей, чтобы сохранить поведение bidi языка и ОТД.

Здесь буквы нижнего регистра присущи символам слева-направо, а буквы верхнего регистра - символам справа-налево:

HEBREW1 HEBREW2 english3 HEBREW4 HEBREW5 HEBREW6 HEBREW7 HEBREW8 english9 english10 english11 HEBREW12 HEBREW13 english14 english15 english16 english17 HEBREW18 english19 HEBREW20

Направление вывода текста: свойства "direction" и "unicode-bidi"

Символы определенных в некоторых шрифтах пишутся справа налево. В некоторых документах, в частности, в документах на арабском языке или на иврите и в некоторых смешанных языковых контекстах текст в одном (визуально отображаемом) блоке может выводиться в различных направлениях. Такая ситуация обозначается термином "двунаправленность" или более коротким термином "bidi" от английского "bidirectionality".

В стандарте Unicode описан сложный алгоритм для определения точного направления текста. Алгоритм состоит из неявной части, основывающейся на свойствах символов, и явной части, управляющей процессом вставки и переназначения. В спецификации CSS2 данный алгоритм используется для осуществления адекватного двунаправленного вывода текста. Свойства "direction" и "unicode-bidi" позволяют разработчикам указывать способы отображения множества элементов и атрибутов языка документа на множество понятий данного алгоритма.

Если документ содержит символы, выводимые справа налево, а агент пользователя отображает эти символы (с использованием соответствующих глифов, а не произвольных заменителей типа вопросительных знаков, шестнадцатеричных кодов, черных прямоугольников и т.д.), то агент должен использовать алгоритм двунаправленного вывода. Это кажущееся на первый взгляд односторонним требование отражает тот факт, что документы, использующие написание справа налево, чаще содержат текст, набранный в противоположном направлении (например, числа или текст на другом языке), чем те документы, в которых основным направлением написания является направление слева направо. Однако следует заметить, что не все документы на арабском языке или на иврите содержат разные направления текста.

Т.к. направление текста зависит от строения и семантики языка документа, данные свойства должны преимущественно использоваться создателями описаний типов документов (DTD) или разработчиками специальных документов. Если в основной таблице стилей указаны данные свойства, то разработчики и пользователи не должны вводить переназначающие их правила. Типичное исключение составляет свойство bidi, которое по запросу пользователя может быть переназначено и использовано агентом для транслитерации идиша (как правило, написанного буквами иврита) латинскими буквами.

В спецификации языка HTML 4.0 (, раздел 8.2) определяется тип поведения элементов HTML при двунаправленном выводе текста. Конформные пользовательские агенты, управляющие выводом HTML-документов, могут игнорировать свойства "direction" и "unicode-bidi" в таблицах стилей разработчиков и пользователей. Правила таблицы стилей, управляющие двунаправленным выводом текста, определенным в описании , представлены в примере таблицы стилей. Спецификация языка HTML 4.0 включает и другую информацию об использовании разных направлений вывода текста.

"direction"

Значение: ltr | rtl | inherit
Начальное значение: ltr
Область применения: все элементы, см. описание
Наследование: да
Процентное задание: N/A

Данное свойство задает основное направление написания, используемое в блоках, направление вставок и переназначений (см. "unicode-bidi") для алгоритма двунаправленного вывода, используемого в Unicode. Оно также задает направление вывода столбцов таблицы, направление горизонтального переполнения и положение неполной последней строки в блоке в случае, если используется выравнивание "text-align:justify".

ltr

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

rtl

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

Чтобы свойство "direction" могло влиять на элементы строкового уровня, свойству "unicode-bidi" необходимо присвоить значение "embed" или "override".

Примечание. Если свойство "direction" применяется к элементам столбцов таблицы, то оно не наследуется ячейками столбца, т.к. столбцы не существуют в дереве документа. Поэтому в CSS не существует простого способа конструирования правил наследования атрибута "dir".

"unicode-bidi"

Значение: normal | embed | bidi-override | inherit
Начальное значение: normal
Область применения: все элементы, кроме see prose
Наследование: нет
Процентное задание: N/A
Устройства: визуального форматирования

Значения данного свойства имеют следующий смысл:

normal

Согласно алгоритму двунаправленного вывода элемент не создает нового дополнительного уровня вставки. Для элементов строкового уровня неявная перегруппировка выполняется только в пределах его границ.

embed

Если элемент является элементом строкового уровня, то данное значение разрешает создание дополнительного уровня вставки согласно алгоритму двунаправленного вывода. Направление данного уровня вставки задается свойством "direction". Внутри элемента перегруппировка выполняется неявно. Это соответствует добавлению LRE (U+202A; для "direction: ltr") или RLE (U+202B; для "direction: rtl") в начало элемента и PDF (U+202C) в конец элемента. <

bidi-override

Если элемент является элементом строкового уровня или элементом уровня блока, который содержит только элементы строкового уровня, то данное значение создает переназначение. Это значит, что внутри элемента перегруппировка осуществляется в строгом порядке согласно свойству "direction", а неявная часть алгоритма двунаправленного вывода игнорируется. Это соответствует добавлению LRO (U+202D; для "direction: ltr") или RLO (U+202E; для "direction: rtl") в начало элемента и добавлению PDF (U+202C) в конец элемента.

В конечном итоге порядок следования символов, выработанный в каждом элементе уровня блока, будет совпадать с тем, который получится в результате добавления управляющих кодов bidi, как это было описано ранее, удаления разметки и подачи получившейся в результате этого последовательности символов в модуль, реализующий алгоритм двунаправленного вывода неформатированного текста, в котором используется то же самое разбиение на строки, что и в форматированном тексте. При этом нетекстовые элементы, например, изображения, рассматриваются как нейтральные символы, если только для свойства "unicode-bidi" не установлено значение "normal". В последнем случае элементы будут рассматриваться как символы в направлении, указанном в свойстве "direction" элемента.

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

Т.к. для алгоритма, используемого в Unicode, установлено ограничение в 15 уровней вставки, рекомендуется не использовать свойство "unicode-bidi" со значением, отличным от "normal", если в этом нет острой необходимости. В частности, значение свойства "inherit" следует использовать очень осторожно. Тем не менее, для элементов, которые будут отображаться в виде блоков, рекомендуется указать "unicode-bidi: embed", чтобы сохранить целостность элемента в том случае, если его вывод будет осуществляться по строкам (см. пример ниже).

В следующем примере показан XML-документ с двунаправленным выводом текста. Он иллюстрирует важный принцип: дизайнерам DTD следует учитывать свойство bidi как для корректных элементов и атрибутов языка документа, так и для всех сопутствующих таблиц стилей. Таблицы стилей должны создаваться таким образом, чтобы правила bidi были отделены от других правил стилей. Правила bidi не должны переназначаться другими таблицами стилей для сохранения bidi-поведения языка документа или DTD.

В этом примере буквы нижнего и верхнего регистра обозначают символы, наследующие направление вывода слева направо и справа налево, соответственно:


ИВРИТ1 ИВРИТ2 русский3 ИВРИТ4 ИВРИТ5
ИВРИТ6 ИВРИТ7 ИВРИТ8


русский9 русский10 русский11 ИВРИТ12 ИВРИТ13
русский14 русский15 русский16
русский17 ИВРИТ18 русский19 ИВРИТ20

Поскольу это XML, то за установление направления написания ответственна таблица стилей. Она приведена ниже:

/* Правила для bidi */
HEBREW, HE-QUO {direction: rtl; unicode-bidi: embed}
RUSSIAN {direction: ltr; unicode-bidi: embed} /* Правила для презентации */
HEBREW, RUSSIAN, PAR {display: block}
EMPH {font-weight: bold}

Элемент HEBREW является блоком с направлением написания справа налево, элемент RUSSIAN - это блок с направлением написания слева направо. Элементы PAR - это блоки, которые наследуют основное направление написания у своих родительских элементов. Таким образом, первые два элемента PAR начинаются с верхней правой стороны, а последние три начинаются с верхней левой стороны. Помните, что названия элементов HEBREW и RUSSIAN выбраны только для примера; как правило, названия элементов должны отображать структуру, не ссылаясь на язык.

Элемент EMPH является элементом строкового уровня, и поскольку его свойство "unicode-bidi" имеет значение "normal" (начальное значение), то он не влияет на упорядочение текста. А элемент HE-QUO создает вставки.

Форматирование этого текста может иметь следующий вид при большой длине строки:

5ТИРВИ 4ТИРВИ русский3 2ТИРВИ 1ТИРВИ
8ТИРВИ 7ТИРВИ 6ТИРВИ
русский9 русский10 русский11 13ТИРВИ 12ТИРВИ
русский14 русский15 русский16
русский17 20ТИРВИ русский19 18ТИРВИ

Помните, что в случае вставки HE-QUO элемент ИВРИТ18 будет расположен справа от элемента русский19.

2ТИРВИ 1ТИРВИ
-ВИ 4ТИРВИ русский3
5ТИР

ВИ 7ТИРВИ 6ТИРВИ
8ТИР

русский9 русский10 рус-
ский11 12ТИРВИ
13ТИРВИ

русский14 русский15
русский16

русский17 18ТИРВИ
20ТИРВИ русский19

Т.к. элемент ИВРИТ18 должен читаться до элемента русский19, то он находится на одну строку выше него. Простое разбиение длинной строки при прежнем форматировании не дало бы результатов. Необходимо учесть, что первый слог элемента русский19 мог бы находиться на предыдущей строке, но разбивка по слогам слов, написанных слева направо, в контексте написания справа налево, и наоборот, обычно не используется во избежание появления дефиса в середине строки.

Лучшие статьи по теме