Свойство text-align определяет выравнивание текста по горизонтали в пределах элемента.
Это свойство применимо ко всем элементам.
Значение свойства text-align
- left – выравнивание текста по левому краю элемента.
- center - выравнивание текста по центру элемента.
- right – выравнивание текста по правому краю элемента.
- justify - выравнивание текста по ширине - одновременно по левому и по правому краю. В этом случае, при необходимости, добавляются пробелы между словами,
- inherit - принимает значение свойства родительского элемента.
Значение по умолчанию
- left
Пример
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title> Свойство text-align </title>
<style type="text/css">
td{border: #FF3300 solid 1px;}
</style>
</head>
<body>
<table style="border:#FF3300 solid 2px;width:700px;">
<tr> <td style="text-align:center;"> Выравнивание текста по центру ячейки </td> </tr>
<tr> <td style="text-align:right;"> Выравнивание содержимого ячейки по ее правому краю <img src="img/peng_64.gif"> </td> </tr>
<tr> <td> Выравнивание текста по левому краю ячейки </td> </tr>
</table>
</body>
</html>
<html>
<head>
<meta charset="utf-8">
<title> Свойство text-align </title>
<style type="text/css">
td{border: #FF3300 solid 1px;}
</style>
</head>
<body>
<table style="border:#FF3300 solid 2px;width:700px;">
<tr> <td style="text-align:center;"> Выравнивание текста по центру ячейки </td> </tr>
<tr> <td style="text-align:right;"> Выравнивание содержимого ячейки по ее правому краю <img src="img/peng_64.gif"> </td> </tr>
<tr> <td> Выравнивание текста по левому краю ячейки </td> </tr>
</table>
</body>
</html>
Результат
