Книга: HTML, XHTML и CSS на 100%
Горизонтальное выравнивание
Горизонтальное выравнивание
Горизонтальное выравнивание содержимого ячейки устанавливается свойством text-align. Если в качестве значения свойства text-align для нескольких ячеек в столбце задана строка текста, то содержимое этих ячеек выравнивается относительно вертикальной оси. Начало строки соприкасается с этой осью. Расположение строки слева или справа относительно оси определяется направлением текста. Если значением свойства text-align для ячейки таблицы является строка, но этой строки нет в содержимом ячейки, то конец содержимого соприкасается с вертикальной осью выравнивания.
Это станет понятно из примера. Создадим следующую таблицу стиля:
td { text-align: "." }
td:before { content: "$" }
Создадим также HTML-документ, который имеет следующий фрагмент кода:
<table>
<col width="40">
<tr> <th>Плата за междугородние звонки
<tr> <td> 1.30
<tr> <td> 2.50
<tr> <td> 10.80
<tr> <td> 111.01
<tr> <td> 85.
<tr> <td> 90
<tr> <td> .05
<tr> <td> .06
</table>
Тогда согласно этой таблице стилей цифры, обозначающие доллары, будут выровнены относительно десятичной точки. Здесь также используется псевдоэлемент: before для вставки значка доллара перед каждой цифрой в строке.
Браузер клиента представит на странице эту таблицу следующим образом:
Плата за междугородние звонки
$1.30
$2.50
$10.80
$111.01
$85.
$90
$.05
$.06
- Вертикальное выравнивание
- Выравнивание данных
- Как избежать проблем с выравниванием
- Выравнивание нестандартных типов данных
- Положение и выравнивание заголовка
- Горизонтальное и вертикальное обобщение типа
- Выравнивание изображения
- Выравнивание элементов управления
- 7.5.2. Выравнивание памяти
- 13.2.1. Выравнивание по страницам
- Выравнивание вдоль вершинной нормали
- 13.6.4. Выравнивание текста