Атрибут dir тега <colgroup>

Описание

Атрибут dir для тега <colgroup> определяет направление текста для всех ячеек в группе столбцов таблицы. Этот атрибут особенно полезен для таблиц с содержимым на языках с написанием справа налево (RTL), таких как арабский или иврит.

Пример использования:
<table border="1"> <colgroup dir="rtl"></colgroup> <colgroup dir="ltr"></colgroup> <tr> <td>نص بالعربية</td> <td>English text</td> </tr> </table>

Допустимые значения:

Значение Описание Эквивалент CSS
ltr Слева направо (по умолчанию) direction: ltr
rtl Справа налево direction: rtl
auto Автоматическое определение направления direction: auto

Рекомендации по использованию:

  • Используйте для смешанных таблиц с LTR и RTL содержимым
  • Для всего документа лучше задавать направление в элементе <html>
  • Сочетайте с атрибутом lang для лучшей семантики
  • Тестируйте с реальным контентом на RTL-языках
  • Учитывайте влияние на выравнивание текста и чисел

Пример сложной таблицы:

<table border="1"> <colgroup dir="rtl" span="2"></colgroup> <colgroup dir="ltr"></colgroup> <tr> <td>עברית</td> <td>العربية</td> <td>English</td> </tr> <tr> <td>טקסט בעברית</td> <td>نص بالعربية</td> <td>Left-to-right text</td> </tr> </table>

Особенности работы:

  • Влияет на порядок отображения текста в ячейках
  • Меняет стандартное выравнивание содержимого
  • Для чисел может потребоваться дополнительное форматирование
  • Не изменяет порядок столбцов в таблице
  • Лучше работает с явно заданным языком через атрибут lang

Пример с CSS:

<style> .rtl-column { direction: rtl; unicode-bidi: embed; } .ltr-column { direction: ltr; } </style> <table> <colgroup class="rtl-column"></colgroup> <colgroup class="ltr-column"></colgroup> <tr> <td>نص عربي</td> <td>Latin text</td> </tr> </table>

Важные замечания:

  • Атрибут наследуется ячейками таблицы
  • Может быть переопределен атрибутом dir в отдельных ячейках
  • Для корректной работы с RTL рекомендуется указывать язык содержимого
  • Влияет на положение полосы прокрутки в переполненных ячейках
  • Тестируйте в разных браузерах

Пример с числами:

<table border="1"> <colgroup dir="rtl"></colgroup> <tr> <td>מספר 12345</td> </tr> <tr> <td dir="ltr">Number 12345</td> </tr> </table>

Примечание: Хотя атрибут dir можно использовать с элементом <colgroup>, для сложных многоязычных таблиц часто лучше управлять направлением текста на уровне отдельных ячеек или строк, чтобы избежать неожиданного поведения.