HTML-вирівнювання по ширині сторінки: поради та рекомендації

Вирівнювання за допомогою CSS

Розташувати елементи веб-сторінки відповідним чином можна не тільки за допомогою HTML, але і засобами CSS. Для виконання цього завдання використовується така властивість стилю, як text-align. Його прописують або в рамках тегу <style> прямо в тілі HTML-документа або виносять в окремий файл стилів з розширенням .css, який потім підключають до сторінки.

Перший варіант краще використовувати на сторінках, які слабко завантажені стилями. Якщо ж кількість CSS-коду дуже велике, то рекомендовано створювати окремий документ, що містить таблиці стилів.

Синтаксис вирівнювання текстових елементів буде виглядати наступним чином.

<style>
p {
text-align: center; /* Вирівнювання по центру */
}
h1 {
text-align: right; /* Вирівнювання по правому краю*/
}
h2 {
text-align: left; /* Вирівнювання по лівому краю*/
}
</style>

Можна звернути увагу, що значення цієї властивості будуть аналогічними тим, що задаються при вирівнюванні по центру в HTML. Те ж саме стосується і розташування тексту по правому і лівому краю або на всю ширину сторінки.

Створіть текстовий документ і скопіюйте туди цей код. В даному прикладі основні абзаци, укладені в тег <p> будуть розташовані посередині сторінки, заголовки першого рівня відобразяться праворуч, а підзаголовки другого рівня — зліва.

Серед сучасних веб-розробників і професіоналів верстки використання таблиць стилів вважається кращим для оптимізації інтернет-сторінки.