Время:
Новых сообщений: Нет
Вы на форуме дней
Ваша группа: Гость
Ваш IP: 18.116.86.160
Logical-Portal — молодежный портал со своей изюминкой, каждый сможет найти что-то интересное и полезное для себя, например наш форум общения с которым вам обязательно нужно ознакомиться.
  • Страница 1 из 1
  • 1
Горизонтальное CSS меню для сайта
Сообщение оставлено 01.06.2010 в 22:24:57 | Сообщение #1

Это в CSS:

Code
/* Menus by winskin.ru */
#menu li {
     display: inline-block;
     list-style:none;
     width: 98px;
     height: 22px;
     text-align: center;
     padding-top: 3px;
     background-repeat:no-repeat;
     color: #ffffff;
     background-position:center;
}
.mattblacktabs{
     width: 100%;
     overflow: hidden;
     border-bottom: 1px solid #363636;     
     background: #FFA500;
     width: 944px;     
     border-left: 1px solid #363636;
     border-right: 1px solid #363636;
     border-top: 1px solid #363636
}

.mattblacktabs ul{
     margin: 0;
     padding: 0;
     padding-left: 0;     
     font: 12px Arial, Helvetica, sans-serif;
     list-style-type: none;
}

.mattblacktabs li{
     display: inline;
     margin: 0;
}

.mattblacktabs li a{
     float: left;
     display: block;
     text-decoration: none;
     margin: 0;
     padding: 3px 8px;     
     border-right: 1px solid #363636;     
     color: #857040;
     background: #FFA500;
     font-family:Arial, Helvetica, sans-serif;
     font-size: 12px;
}

.mattblacktabs li a:hover, .mattblacktabs li.selected a{
background: #E8E8E8; /*background of tabs for hover state, plus tab with "selected" class assigned to its LI */
}
/* --------- */

Это туда, где хотите видеть меню:

Code
<!-- МЕНЮ  by winskin.ru -->
<DIV class="mattblacktabs">
     <UL>
     <LI><A href="/">Главная</A></LI>
     <LI><A href="/index/0-2">Гостевая</A></LI>
     <LI><A href="/load">каталог файлов</A></LI>
     <LI><A href="/news">Новости сайта</A></LI>
     <LI><A href="/dir">каталог сайтов</A></LI>
     <LI><A href="ссылка">Видеотека</A></LI>
     <LI><A href="ссылка">обоины</A></LI>
     <LI><A href="http://winskin.ru">winskin.ru</A></LI>
     <LI><A href="ссылка">Разное</A></LI>
     <LI><A href="ссылка">Партнёрам</A></LI>
     <LI><A href="/forum">форум сайта</A></LI>
     <LI><A style="border-right:none; width: 33px;"  href="ссылка">ссылка</A></LI></UL></DIV>
<!--/МЕНЮ-->


 Сообщение отредактировал SpiritIce - Вторник, 01.06.2010, 22:26:55
 
 
   
  • Страница 1 из 1
  • 1
Поиск:
 
Графика от: Megas, GraFOS | Дизайн сверстал E.A.
Хостинг от uCoz
Яндекс.Метрика