Как выровнять текст на веб-странице в HTML или CSS

Любой текст может быть выровнен по левому краю, по центру или справа на веб-странице. Изображения также могут быть выровнены на веб-странице так же, как текст. Ниже приведены примеры выравнивания текста и изображений по левому краю, по центру и по правому краю.

Чаевые

Если какое-либо выравнивание текста не работает, убедитесь, что другие стили CSS, примененные к элементу или содержащему его элементу, не противоречат обоснованию, которое вы пытаетесь установить.

Заметка

С этими примерами и большей частью выравнивания текст выравнивается в элементе, содержащем текст. Текст может быть центрирован в HTML-элементе div и выровнен по левому краю на остальной части веб-страницы. Кроме того, все, что содержится в теге, содержащем обоснование CSS (например, изображение), также выравнивается.

Примеры выравнивания

Выравнивание по левому краю

Выравнивание по вкладке

Центр выровнен

Выровнен по правому краю

Выровненный по левому краю пример

По умолчанию английский и другие языки выравнивают текст по левому краю. Однако, если элемент, содержащий текст или изображение, выровнен по правому краю или вам необходимо изменить выравнивание текста или изображения, приведенный ниже код можно добавить в ваш элемент или в CSS.

HTML код

Выравнивание по левому краю

Чаевые

Ниже приведены дополнительные советы по настройке выравнивания, отступов и полей элемента.

Пример выровненного табуляции

Хотя выравнивания текста на вкладке нет, к элементу может быть добавлено левое поле, как показано ниже.

HTML код

Выравнивание по вкладке

Чаевые

Ниже приведены дополнительные советы по настройке выравнивания, отступов и полей элемента.

Выровненный по центру пример

Используя атрибут text-align, вы можете центрировать любой текст или изображение в элементе, как показано в примере ниже.

HTML код

Центр выровнен

Чаевые

Ниже приведены дополнительные советы по настройке выравнивания, отступов и полей элемента.

Выровненный справа пример

Используя атрибут text-align, вы можете центрировать любой текст или изображение в элементе, как показано в примере ниже.

HTML код

Выровнен по правому краю

Чаевые

Кроме того, вы можете использовать CSS, чтобы выровнять изображение по правому краю на веб-странице.

Чаевые

Ниже приведены дополнительные советы по настройке выравнивания, отступов и полей элемента.

Дополнительные советы по выравниванию

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

  1. Дополнительное поле может быть добавлено к любому из вышеперечисленных стилей, если вам требуется дополнительный отступ или вы хотите больше отступов. Например, вы можете применить поле margin-right к выровненному по правому краю примеру, чтобы переместить текст дальше в элемент.
  2. Если вы хотите более отзывчивую страницу, обязательно отрегулируйте или удалите выравнивание по левому или правому краю при просмотре на меньшем экране.
Ссылка на основную публикацию
Adblock
detector