Простое CSS меню
![]()
Проще меню для сайта придумать очень сложно, т.к. в данном меню используется всего лишь 2 картинки с градиентом и немного HTML и CSS кода.
Для того, чтобы меню заработало необходимо в ставить код.
HTML код:
<ul class="solidblockmenu">
<li><a href="#" title="Домой">Домой</a></li>
<li><a href="#" title="PHP">PHP</a></li>
<li><a href="#" title="JavaScript">JavaScript</a></li>
<li><a href="#">JavaScript</a></li>
<li><a href="#" title="CSS" class="current">CSS</a></li>
<li><a href="#" title="Контакты">Контакты</a></li>
</ul>
CSS код:
.solidblockmenu{
margin: 0;
padding: 0;
float: left;
font: bold 13px Arial;
width: 100%;
border: 1px solid #625e00;
border-width: 1px 0;
background: black url(blockdefault.gif) center center repeat-x;
}
.solidblockmenu li{
display: inline;
}
.solidblockmenu li a{
float: left;
color: white;
padding: 9px 11px;
text-decoration: none;
border-right: 1px solid white;
}
.solidblockmenu li a:visited{
color: white;
}
.solidblockmenu li a:hover, .solidblockmenu li .current{
color: white;
background: transparent url(blockactive.gif) center center repeat-x;
}
Вроде ничего сложно в этом нет.
| Прикрепленный файл | Размер |
|---|---|
| Скачать solid block menu | 907 байтов |