вРазные полезности

Горизонтальное меню для сайта в стиле DLE

 
Думаю вам понравиться Горизонтальное меню для сайта в стиле DLE. Его дизайн напоминает сайт на движке DLE. Но нет это горизонтальное меню для сайтов системы ucoz. Так же на нем есть немного но таких нужных функций как регистрация и вход и выход сайта, но и в добавок еще несколько. И все так красиво вписывается в дизайн, что думаю ко многим сайтам оно подойдет.
Установка:
Первым делом скачиваем архив с нашего сайта и закидываем его в корень сайта. Потом переходим к стилям и прописываем его в CSS.

Код
/* Верхнее меню */  
.wrap width:1054px; margin:0px auto; position:relative; text-align:left;  
.side background:#212121; overflow:hidden; border-radius:5px; margin-top:8px; text-align:left;  
.side_left float:left; width:237px; overflow:hidden; margin:8px;  
.side_right float:right; width:237px; overflow:hidden; margin:8px;  
.side_center margin:8px 263px 0;  
body background:#229ccf; padding:0; margin:0; text-align:center; padding:0; margin:0;  
body, td color:#fff; font:13px Cuprum; padding:0; margin:0; font-style:italic;  

a color:#fff; text-decoration:none;  
a:hover text-decoration:none;  
a img border:0;  

background-color: #3366CC;  
.left float:left;  
.right float:right;  

p margin:10px 0;  
hr border-top:1px dotted #9d7a59; border-bottom:none; border-left:none; border-right:none;  
ul,li display:block; padding:0; margin:0; list-style:none;  

.h_menus height:45px; overflow:hidden; margin-top:10px;  
.h_menu background:url(/Header/h_menu.png) no-repeat; width:733px; height:45px; overflow:hidden; margin:0 auto; float:left;  
.h_menu ul height:45px; display:block; float:left;  
.h_menu li background:url(/Header/h_line.png) no-repeat right; float:left; height:45px; line-height:30px;  
.h_menu li a height:30px; display:inline-block; padding:0 20px 0 10px; margin-left:8px; color:#fff; text-decoration:none; margin-top:7px; text-shadow:1px 1px #6f6f6f;  
.h_menu li a:hover background:url(/Header/h_menu_left.png) no-repeat left,url(/Header/h_menu_right.png) no-repeat right,url(/Header/h_menu_center.png) repeat-x center; text-shadow:1px 1px #595959;  
.h_panel background:url(/Header/h_panel.png) no-repeat; float:left; width:171px; height:45px; margin-right:4px;  
.h_reg background:url(/Header/h_reg.png) no-repeat; width:84px; height:28px; float:left; margin:8px 0 0 14px;  
.h_in background:url(/Header/h_in.png) no-repeat; width:52px; height:28px; float:left; margin:8px 0 0 5px;  
.h_panel1 background:url(/Header/h_panel1.png) no-repeat; float:right; width:143px; height:45px;  
.h_ico1 background:url(/Header/h_ico.png) no-repeat 0 0; width:28px; height:27px; float:left; margin:9px 0 0 17px;  
.h_ico2 background:url(/Header/h_ico.png) no-repeat 0 -27px; width:28px; height:27px; float:left; margin:9px 0 0 10px;  
.h_ico3 background:url(/Header/h_ico.png) no-repeat 0 -54px; width:28px; height:27px; float:left; margin:9px 0 0 10px;  
.header overflow:hidden; width:1054px;  
/* —————— */

И завершаем, копируем код и вставляем его в верхнее часть сайта в самый низ его.

Код
<div class=»wrap»>  
<div class=»h_menus»>  
<div class=»h_menu»>  
<ul>  
<li><a href=»/»>Главная страница</a></li>  
<li><a href=»/load»>Каталог файлов</a></li>  
<li><a href=»/publ»>Каталог статей</a></li>  
<li><a href=»/news»>Новости сайта</a></li>  
<li><a href=»/forum»>Форум сайта</a></li>  
</ul>  
</div>  
<div class=»right»>  
<div class=»h_panel»>  
<a href=»/index/3″><div class=»h_reg»></div></a>  
<a href=»$LOGIN_LINK$»><div class=»h_in»></div></a>  
</div>  
<div class=»h_panel1″>  
<a href=»Ваша ссылка»><div class=»h_ico1″></div></a>  
<a href=»http://zornet.ru/load/0-0-0-0-1″><div class=»h_ico2″></div></a>  
<a href=»http://zornet.ru/»><div class=»h_ico3″></div></a>  
</div>  
</div>  
</div>  
<div class=»header»></div>