This page was translated from English by the community. Learn more and join the MDN Web Docs community.

text-align

Резюме

text-align CSS свойство описывает, как линейное содержимое, наподобие текста, выравнивается в блоке его родительского элемента. text-align не контролирует выравнивание элементов самого блока, но только их линейное содержимое.

Начальное значениеstart, или неназванное значение, которое действует как left, если direction: ltr или как right, если direction: rtl, а если start не поддерживается браузером.
Применяется кблочные контейнеры
Наследуетсяда
Обработка значениякак указано, кроме значения match-parent, которое вычисляется вместо значения его родителя direction, а результаты в вычисленном значении left или right
Animation typediscrete

Синтаксис

Формальный синтаксис: 
start | (en-US) end | (en-US) left | (en-US) right | (en-US) center | (en-US) justify | (en-US) match-parent


text-align: left
text-align: right
text-align: center
text-align: justify
text-align: start
text-align: end
text-align: match-parent
text-align: start end
text-align: "."
text-align: start "."
text-align: "." end

text-align: inherit

Значения

start Это экспериментальное API, которое не должно использоваться в рабочем коде.
Подобно left если направление слева направо, и right если наоборот.
end Это экспериментальное API, которое не должно использоваться в рабочем коде.
Подобно right если направление слева направо, и left если наоборот.
left
Линейное содержимое выравнивается по левому краю линейного блока.
right
Линейное содержимое выравнивается по правому краю линейного блока.
center
Линейное содержимое центрируется в линейном блоке.
<string> Это экспериментальное API, которое не должно использоваться в рабочем коде.
Первое появление односимвольной строки - это элемент используемый для выравнивания. Ключевое слово, следует или предшествует, и определяет, как это выравнивается. Это позволяет выравнять численные значения с десятичной точкой, к примеру.
justify
Текст выравнивается. Тексту следует выстраивать свои левые и правые границы по левым и правым границам содержимого параграфа.
match-parent Это экспериментальное API, которое не должно использоваться в рабочем коде.
Наподобие inherit с различием, что значение start и end вычисляются в соответствии direction и заменяются соответствующим left или right значением.

Примеры

Посмотреть живые примеры

Живые примеры

div { text-align: center; border:solid; }

p { background:gold; width:22em; }

несколько текста...
div { text-align: center; border:solid; }

p { background:gold; width:22em; margin: 1em auto; }

несколько текста...
div { text-align:-moz-center; text-align:-webkit-center; border:solid; }

p { background:gold; width:22em; }

несколько текста...

Примечание

Стандартный совместимый способ центрировать сам блок без выравнивания его содержимого, это установка его left и right margin в auto, пример:
margin:auto; или margin:0 auto; или  margin-left:auto; margin-right:auto;

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

Спецификация Статус Комментарий
CSS Logical Properties and Values Level 1
Определение 'text-align' в этой спецификации.		 Редакторский черновик Нет изменений
CSS Text Module Level 3
Определение 'visibility' в этой спецификации.		 Кандидат в рекомендации Добавлены ключевые слова start, end и match-parent. Изменено безымянное начальное значение в start (которое было).
CSS Level 2 (Revision 1)
Определение 'text-align' в этой спецификации.		 Рекомендация Нет изменений
CSS Level 1
Определение 'text-align' в этой спецификации.		 Рекомендация Исходное определение.

Совместимость с браузерами

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help! (en-US)

Возможность Chrome Firefox (Gecko) Internet Explorer Opera Safari
Базовая поддержка (left, right, center and justify) 1.0 1.0 (1.7 или ранее) 3.0 3.5 1.0 (85)
Block alignment values [1] Это API не было стандартизировано. 1.0-webkit (en-US) 1.0 (1.7 или ранее)-moz (en-US) Нет Нет 1.0 (85)-khtml (en-US)
1.3 (312)-webkit (en-US)
start Это экспериментальное API, которое не должно использоваться в рабочем коде. 1.0 1.0 (1.7 или ранее) Нет (Да) 3.1 (525)
end Это экспериментальное API, которое не должно использоваться в рабочем коде. 1.0 3.6 (1.9.2) Нет Нет 3.1 (525)
match-parent Это экспериментальное API, которое не должно использоваться в рабочем коде. 16 Нет Нет Нет Нет
string>
value Это экспериментальное API, которое не должно использоваться в рабочем коде. 		Нет Нет Нет Нет Нет
Возможность Android Chrome for Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Базовая поддержка ? ? ? ? ? ?
Block alignment values [1] Это API не было стандартизировано. ? ? ? ? ? ?
start Это экспериментальное API, которое не должно использоваться в рабочем коде. ? ? ? ? ? ?
end Это экспериментальное API, которое не должно использоваться в рабочем коде. ? ? ? ? ? ?
match-parent Это экспериментальное API, которое не должно использоваться в рабочем коде. ? ? ? ? ? ?
<string> (en-US) value Это экспериментальное API, которое не должно использоваться в рабочем коде. ? ? ? ? ? ?

[1] Оба WebKit и Gecko поддерживают префиксную версию left, center, и right, которая применяется не только к линейному содержимому, но также и к блочным элементам. Это используется для реализации унаследованных align атрибутов на некоторых таблично-связанных элементах. Не используйте их в рабочих сайтах.

Смотрите также