CSS свойство text-align

Свойство text-align используется для выравнивания внутреннего контента блочного элемент.

Для центрирования элемента может быть использовано свойство margin.

Выравнивание, указанное с помощью свойства text-align, не соответствует окну просмотра или содержащему блоку.

Значение по умолчанию	left при направлении "ltr", right при направлении "rtl"
Применяется	К блочным контейнерам.
Наследуется	Да
Анимируемое	Нет
Версия	CSS1
DOM синтаксис	object.style.textAlign = "right";

Синтаксис

text-align: left | right | center | justify | initial | inherit;

Пример

<!DOCTYPE html>
<html>
  <head>
    <title>Заголовок документа</title>
    <style>
      div{           
      text-align: right;
      }    
      p{   	
      text-align: center;
      }
    </style>
  </head>
  <body>
    <h2>Пример свойства text-align</h2>
    <div>Пример для свойства text-align.</div>
    <p>Например, какой-нибудь параграф.</p>
  </body>
</html>

Попробуйте сами!

Пример со значениями “center”, “left” и “justify”:

Пример

<!DOCTYPE html>
<html>
  <head>
    <title>Заголовок документа</title>
    <style>
      h2 {
      text-align: center;
      }
      p.date {
      text-align: left;
      }
      p.example {
      text-align: justify;
      }
    </style>
  </head>
  <body>
    <h2>Пример свойства text-align</h2>
    <p class="date">Март, 2019</p>
    <p class="example">Lorem Ipsum - это текст-"рыба", часто используемый в печати и вэб-дизайне. Lorem Ipsum является стандартной "рыбой" для текстов на латинице с начала XVI века. В то время некий безымянный печатник создал большую коллекцию размеров и форм шрифтов, используя Lorem Ipsum для распечатки образцов. </p>
  </body>
</html>

Попробуйте сами!

Значения

Значение	Описание
left	Выравнивает по левому краю. Значение по умолчанию.
right	Выравнивает по правому краю.
center	Выравнивает по центру.
justify	Увеличивает строки таким образом, чтобы каждая строка имела равную ширину.
initial	Устанавливает свойство в значение по умолчанию.
inherit	Значение элемента наследуется от родительского элемента.


1.0+	12.0+	1.0+	1.0+	✓

1.0+

12.0+

1.0+

✓

CSS свойство text-align

Синтаксис

Пример

Пример

Значения

Поддержка браузера

Практикуйте свои знания