Книга: HTML 5, CSS 3 и Web 2.0. Разработка современных Web-сайтов

Многоцветные рамки

Многоцветные рамки

Мы уже знаем, что с помощью особых атрибутов стиля CSS можно создавать одноцветные рамки у любых элементов Web-страницы.

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

Многоцветные рамки создают с помощью расширений CSS — moz-border-left- colors, — moz-border-top-colors, — moz-border-right-colors и — moz-border-bottom- colors. Они задают цвета, соответственно, для левой, верхней, правой и нижней стороны рамок.

— moz-border-left-colors|-moz-border-top-colors|-moz-border-right-colors|

— moz-border-border-colors: <набор цветов, разделенных пробелами>|none

Значение none убирает "многоцветье" у соответствующей стороны рамки. Это значение по умолчанию.

Данные расширения CSS поддерживаются только Firefox и не включены в стандарт CSS.

Пример:

#cheader { width: 1010px;

padding: 0 20px;

border-bottom: medium dotted;

— moz-border-bottom-colors: #B1BEC6 #F8F8F8 #B1BEC6 }

Здесь мы задаем для контейнера cheader рамку, состоящую из одной нижней стороны, средней толщины, с тремя цветами.

Оглавление книги