Автор: Алексей
Простенькое, горизонтальное меню на HTML и CSS в виде прямоугольных кнопочек:
HTML
Code: Select all
<ul class="css-menu-1">
<li><a href="#">Первая</a></li>
<li><a href="#">Вторая</a></li>
<li><a href="#">Третья</a></li>
<li><a href="#">Четвёртая</a></li>
</ul>
CSS
Code: Select all
ul.css-menu-1 {
list-style: none
}
ul.css-menu-1 li {
display: inline
}
ul.css-menu-1 li a {
font-family: Tahoma, Geneva, sans-serif;
text-decoration: none;
background: #5c6cb7;
font-weight: bold;
color: #ffaa00;
padding: 6px 10px 6px 10px
}
ul.css-menu-1 li a:hover {
padding: 6px 10px 6px 10px;
font-weight: bold;
background: #364d95;
color: #ff9900
}
ul.css-menu-1 li a.selected {
background: #364e95
}