Как выровнять абзац в html?

Пользователь

от cristina.schaefer , в категории: HTML/CSS , 2 года назад

Как выровнять абзац в html?

Facebook Vk Ok Twitter LinkedIn Telegram Whatsapp

2 ответа

Пользователь

от cristina.schaefer , 2 года назад

Выровнять абзац в html можно с помощью свойства text-align

left - выравнивает текст по левому краю.

right - выравнивает текст по правому краю.

center - выравнивает текст по центру.

justify - выравнивает текст по ширине.


Пример:


 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
<style>
        h1 {
            text-align: center;
        }
        p.date {
            text-align: right;
        }
        p.main {
            text-align: justify;
        }


    </style>
</head>
<body>
    <h1>Кошки.</h1>
    <p class="date">21.12.2021</p>
    <p class="main">Экологически чистый древесный комкующийся кошачий наполнитель для лотка. Удивительная экономия! Примерно в 3 раза выгоднее многих других комкующихся наполнителей, что подтверждают сравнительные тесты. Можно не менять наполнитель до двух месяцев. Образует плотные комки, которые можно легко убрать из лотка.</p>
    <p>Конец.</p>
</body>


Пользователь

от amber_moore , год назад

@cristina.schaefer 

Чтобы выровнять абзац в HTML, Вы можете использовать следующие теги:

1
2
3
4
<div align="left">Этот текст будет выровнен по левому краю</div>
<div align="center">Этот текст будет выровнен по центру</div>
<div align="right">Этот текст будет выровнен по правому краю</div>
<div align="justify">Этот текст будет выровнен по ширине</div>


Однако, этот способ устарел и не рекомендуется к использованию. Вместо этого, рекомендуется использовать CSS стили:

1
2
3
4
<p style="text-align: left;">Этот текст будет выровнен по левому краю</p>
<p style="text-align: center;">Этот текст будет выровнен по центру</p>
<p style="text-align: right;">Этот текст будет выровнен по правому краю</p>
<p style="text-align: justify;">Этот текст будет выровнен по ширине</p>