Веб-графика наше всё


Меню вертикальное (код)

Дата:  11.2.10 | Раздел: Коды CSS и HTML

Меню вертикальное с перекатом (ролловером)
HTML код вставляете в шаблон сайта


<table width="170" cellspacing="0" cellpadding="0">
<tr>
    <td style="font-weight: bold; font-size: 20px; background-color:#DFEBF4">
    Главное меню
    </td>
    </tr>
   
  <tr>
    <td>
    <a href="http://webgraphica.ru" target="_blank" class="menu_hor">Вебграфика</a>
    <a href="#" target="_blank" class="menu_hor">Ссылка 2</a>
    <a href="#" target="_blank" class="menu_hor">Ссылка 3</a>
    <a href="#" target="_blank" class="menu_hor">Ссылка 4</a>
    <a href="#" target="_blank" class="menu_hor">Ссылка 5</a>
    <a href="#" target="_blank" class="menu_hor">Ссылка 6</a>
    <a href="#" target="_blank" class="menu_hor">Ссылка 7</a>
    <a href="#" target="_blank" class="menu_hor">Ссылка 8</a>
    <a href="#" target="_blank" class="menu_hor">Ссылка 9</a>
    <a href="#" target="_blank" class="menu_hor">Ссылка 10</a>
    </td>
  </tr>
</table>

CSS код вставляете в основной файл, обычно он называется style.css

/* CSS Document */
.menu_hor {
font-size: 16px;
display: block;
color: #006699;
border-left: #0099CC solid 8px;
text-align: left;
margin-bottom: 4px;
margin-left: 2px;
margin-top: 4px;
margin-right: 2px;
text-decoration: none;
}
a.menu_hor:hover {
font-size: 16px;
display: block;
color: #006699;
border-left: #CC3300 solid 8px;
text-align: left;
margin-bottom: 4px;
margin-left: 2px;
margin-top: 4px;
margin-right: 2px;
text-decoration: none;
background-color: #FFFFCC;
}

Это и другие меню в файлах можно скачать здесь





Cтатья опубликована на сайте "Территория Веб графики и фонов":
http://webgraphica.ru

Адрес статьи:
http://webgraphica.ru/modules/myarticles/article_storyid_53.html