Форматування тега горизонтального правила
Хочете розділити свою сторінку або вказати окремий розділ? Горизонтальне правило може зробити це за вас. Це також надзвичайно настроюється за допомогою атрибутів HTML та CSS.

Правило по горизонталі - це просто спосіб намалювати горизонтальну лінію по всій сторінці. Основне неформатоване горизонтальне правило виглядає так:


... і вказується на
в HTML-коді. Однак ви можете отримати дуже фантазії, змінивши ширину, вирівнювання, колір та інше за допомогою атрибутів HTML. Ось кілька варіантів.

Щоб змінити ширину, ви використовуєте атрибут "width" (досить логічно, правда?) Так:




... яка дає вам горизонтальну лінію на половині наявного простору, наприклад:


Ви також можете вказати ширину в пікселях, використовуючи формат
або просто
.

Далі давайте змінимо колір. Використовуйте наступний формат:




Для непосвячених вище букви та цифри - це шістнадцятковий код для червоного кольору. Зразок наведеного вище коду дасть вам такий рядок, як наведений нижче:


Ви можете встановити горизонтальне вирівнювання правила вліво, по центру або вправо. Просто використовуйте код, як наведено нижче:




... і ви побачите такий рядок:


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

Усі ці приклади стосуються багатьох інших елементів HTML, але також горизонтальне правило має унікальний атрибут: noshade. Цей атрибут видаляє тривимірний ефект лінії. Ви можете застосувати атрибут noshade наступним чином:



... і ось як це буде виглядати:


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

Відео Інструкція: Ширина колонок и группировка столбцов HTML таблицы: теги col и colgroup (Квітня 2024).