Оглавление

Изменение стиля горизонтальной линии

Как правило, при разметке документа следует избегать использования элементов, выполняющих чисто визуальные функции, такие как горизонтальная линия (hr). Документ, структура которого описывает назначение его элементов, легче поддерживать; он быстрее загружается и более понятен для поисковых систем. Эффекта, аналогичного использованию горизонтальной линии, можно добиться с помощью рамок существующих элементов.

 

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

 

Решение
С помощью CSS можно изменить цвет, высоту и ширину горизонтальной линии. Однако это следует делать с осторожностью, поскольку один и тот же эффект может по-разному выглядеть в различных браузерах. К примеру, в следующем примере используются два свойства, color и background-color, с одним и тем же значением, поскольку браузеры, основанные на движке Gecko, например Firefox, изменяют цвет линии с помощью свойства background-color, а Internet Explorer – с помощью color:

 

hr {
border: none;
background-color: #256579;
color: #256579;
height: 2px;
width: 90%;
}


Результат можно увидеть на рис. 2.19.

 

Изменение цвета, высоты и ширины горизонтальной линии

Рис. 2.19. Изменение цвета, высоты и ширины горизонтальной линии

Комментарии принадлежат их авторам. Мы не несем ответственности за их содержание.
Отправитель Нити