Главная страница » Как сделать текст по центру в html

Как сделать текст по центру в html

  • автор:

Выравнивание текста

Выравнивание текста определяет его внешний вид и ориентацию краев абзаца и может выполняться по левому краю, правому краю, по центру или по ширине. Наиболее распространенный вариант — выравнивание по левому краю, когда слева текст сдвигается до края, а правый остается неровным. Выравнивание по правому краю и по центру в основном используется в заголовках и подзаголовках. Следует иметь в виду, что при использовании выравнивания по ширине, в тексте между словами могут появиться большие интервалы, что не очень красиво.

Для установки выравнивания текста обычно используется тег параграфа

с атрибутом align , который определяет способ выравнивания. Также блок текста допустимо выравнивать с помощью тега

  • left — выравнивание по левому краю, задается по умолчанию;
  • right — выравнивание по правому краю;
  • center — выравнивание по центру;
  • justify — выравнивание по ширине (одновременно по правому и левому краю). Это значение работает только для текста, длина которого более, чем одна строка.

Атрибут align можно применять как для текста, так и для заголовков (пример 7.4).

Пример 7.4. Способы выравнивания текста

Результат данного примера показан на рис. 7.4.

Как отцентрировать текст в HTML

Не знаете как выровнять текст по центру в HTML? Отцентрировать текст в HTML можно, используя тег или применив выравнивание текста по центру CSS .

Один из способов отцентрировать текст – заключить его в теги :

Вставка этого текста в HTML-код приведет к следующему результату:

Примечание: Сегодня тег признан устаревшим. И хотя он все еще работает, ожидается, что он будет удален. Для центрирования текста мы рекомендуем использовать CSS .

Использование свойства CSS

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

Центрирование нескольких блоков текста

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

Заметьте, что для свойства text-align мы установили значение center , которое означает, что элемент необходимо выровнять по центру.

Несколько блоков текста

Как выровнять текст по центру CSS , если много блоков текста? Вы можете использовать тег в секции head ( или во внешней таблице стилей ), чтобы отцентрировать каждый элемент.

Текст будет отцентрирован внутри каждой пары тегов

. Если необходимо выровнять по центру только несколько параграфов, тогда можно создать класс CSS , как это показано ниже:

Если вы создадите класс center , как показано в предыдущем примере, параграф может быть отцентрирован с помощью приведенного ниже кода, который « вызывает » класс center :

Совет : Созданный класс для CSS выравнивания текста по центру блока можно использовать для любого HTML-тега . Например, если вы хотите, чтобы заголовок располагался по центру, добавьте class=»center» в тег

Тег HTML выравнивание текста по центру

Тег в HTML используется, чтобы выровнять текст по центру.

Текст, помещенный внутри тега , будет размещен симметрично относительно центра родительского блока.

Тег является устаревшим и не поддерживается в HTML5.

Как выровнять текст по центру в HTML5

В HTML5 выравнивание текста по центру (по середине блока) осуществляется при помощи CSS свойства text-align . Значение center позволяет выровнять текст относительно центра (центрирование). Другие значения: left, right, justify изменяют правило выравнивания на, соответственно, по левому краю, по правому краю и по ширине блока.

Синтаксис

Отображение в браузере

Пример использования в HTML коде

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

Тег
Да Да Да Да Да

Атрибуты

Тег не имеет собственных атрибутов, поддерживает глобальные HTML атрибуты.

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *