Справочник по CSS : Тематический указатель : Справочник по свойствам и атрибутам : Шрифт и текст : direction

Материал из Справочник Web-языков.

Содержание

1 Атрибут direction | Свойство direction

[править] Атрибут direction | Свойство direction

Задает порядок считывания объекта.

[править] Синтаксис

HTML	{ direction : sDirection }
Скрипты	[ sDirection = ] object.style.direction[ = v ]

[править] Используемые значения

sDirection: Строка, которая устанавливает или принимает одно из следующих значений.

ltr	Значение по умолчанию. Содержимое выравнивается слева направо.
rtl	Содержимое выравнивается справа налево.
inherit	Выравнивание содержимого наследуется .

Это свойство читается/записывается для всех объектов, кроме currentStyle (только чтение). Свойство имеет значения по умолчанию ltr. Атрибут Каскадных таблиц стилей (CSS) не наследуется.

Данные выражения могут использоваться в Internet Explorer, начиная с версии IE5.

[править] Замечания

Свойство не оказывает воздействие на буквенно-цифровые символы в документах на латинице. Эти символы всегда визуализируются слева направо. Однако, свойство влияет на символы пунктуации в этих документах.

Свойство имеет отношение только к направленному выравниванию содержимого элемента. Оно не оказывает влияния на такие свойства как left или right, на margin-left или margin-right. Свойство margin-left, например, устанавливает или находит ширину поля с левой стороны документа, не обращая внимание на значение свойства direction.

[править] Пример

В данном примере показывается как установить и присваивоить значение свойству direction. Когда пользователь устанавливает значение свойства direction для элемента div, оно автоматически будет присвоено и элементу span.

<HTML>
  <HEAD>
    <SCRIPT>
    function fnSwitch()
    {
      oDiv.style.direction = event.srcElement.innerText;
      DirSpan.innerText = oDiv.style.direction;
    }
    </SCRIPT>
  </HEAD>
  <BODY>
    <H1>direction Property Sample</H1>
    <H2>direction: 
      <SPAN id="DirSpan" style="color:red"></SPAN>
    </H2>

  [ <A href="#" onclick=fnSwitch()>ltr</A> | <A href="#" 
  onclick=fnSwitch()>rtl</A> | <A href="#" onclick=fnSwitch()>inherit</A> ]</P>
  
  <DIV id="oDiv">The quick brown fox jumps over the lazy yellow dog. The quick brown fox 
  jumps over the lazy yellow dog. The quick brown fox jumps over the lazy yellow 
  dog. The quick brown fox jumps over the lazy yellow dog. The quick brown fox 
  jumps over the lazy yellow dog.</DIV>
</BODY>
</HTML>