следующим образом:
#mainNav а {
color: #000:
font-size: llpx:
text-transform: uppercase:
text-decoration: поnе:
border: lpx dashed #999:
Ьorder-Ьottom: поnе;
padding: 7рх Spx 7рх ЗОрх;
display: Ьlock:
background-color: #Е7Е7Е7:
background-image: url(images/nav.png);
background-repeat: no-repeat:
background-position: О 2рх:
Выглядит неплохо: текст каждой ссылки отделен от значка, границы выделяются.
Однако нижняя граница последней ссылки исчезла. Существует несколько
Способов разобраться с этим. Один состоит в том, чтобы создать стилевой
Класс с надлежащим параметром нижней границы border-bottom, а затем применить
его к этой ссылке. Будет гораздо проще применить нижнюю границу к тегу <u 1 >,
Глава 9. Приводим в порядок навигацию сайта
Содержащему список ссылок (поскольку этот тег не имеет отступов, нет промежутка,
отделяющего верх <ul> от верхней стороны этой первой ссылки).
Добавьте верхнюю границу в стиль ul#mainNav, чтобы он выглядел следующим
образом:
#mainNav {
margin: О;
padding: О;
list-style: поnе:
width: 175рх;
Ьorder-Ьottom: lpx dashed #999:
Вот и все, мы создали простейшую паиель навигации с применением границ,
Отступов, фонового цвета и изображений (см. рис. 9.15, 6).
Добавление ролловеров и выделение текущего
Раздела сайта стилем выбранных ссылок