Простое меню распространено на многих сайтах ucoz
Данный блок подойдет для любого светлого сайта,
Внимание размер фиксируется в стиле самого блока и меню
Установка:
данный стиль должен быть обязательно под ссылкой на основную таблицу стилей то есть под стандартным css, в противном случае ссылки будут синими а не серыми )
Code
<style type='text/css' media='screen'>
.Smenu_link, .Smenu_link:visited {display:block; width:170px; padding:4px 3px 4px 19px; background:url('img/site_menu.png') no-repeat #fff; background-position:4px 5px; border-bottom:1px solid #f7f7f7; font-size:9pt;}
.Smenu_link:hover, .Smenu_link:active {text-shadow:0 0 5px #fff; -moz-border-radius:3px;-webkit-border-radius:3px; border-radius: 3px; color:#fff; background:url('img/site_menu.png') no-repeat #848484; background-position:4px -12px;}
.Smenunews_link, .Smenunews_link:visited {display:block; width:300px; padding:4px 3px 4px 19px; background:url('img/site_menu.png') no-repeat #fff; background-position:4px 5px; border-bottom:1px solid #f7f7f7; font-size:9pt;}
.Smenunews_link:hover, .Smenunews_link:active {text-shadow:0 0 5px #fff; -moz-border-radius:3px;-webkit-border-radius:3px; border-radius: 3px; color:#fff; background:url('img/site_menu.png') no-repeat #848484; background-position:4px -12px;}
a:link, a:visited {text-decoration:none; color:#848484;}
a:hover, a:active {text-decoration:none; color:#000000;}
.block {width:210px; text-align:left; margin:0px 5px;}
.block_top {text-align: left; font-size: 8pt; color:#fff; background:url('img/block_top.png') no-repeat; font-weight: bold; margin: 0; padding: 5px 10px; height:25px;}
.block_top_red {width:210px; height:31px; color:#AF0000; background:url('img/block_top_red.png') no-repeat; font-weight:bold; text-shadow:0px 1px 0px #fff; padding:3px 0 0 15px;}
.block_middle {width:210px; background:url('img/box-content.png') repeat-y; padding:3px 10px 0 10px;}
.block_bottom {width:210px; height:10px; background:url('img/box-bottom.png') no-repeat;}
</style>
Ну а это само меню с блоком , работает прекрасно только вместе
Code
<table class="block" border="0" cellpadding="0" cellspacing="0">
<tbody>
<tr><td class="block_top">
<!-- <bt> --><!--<s5184>-->Меню сайта<!--</s>--><!-- </bt>--></td></tr><tr><td class="block_middle">
<a class="Smenu_link" href="http://ucozon.ru/">Главная</a>
<a class="Smenu_link" href="http://ucozon.ru/forum">Наш uCoz Форум</a>
<a class="Smenu_link" href="http://ucozon.ru/dir/1-0-4">Скрипты для uCoz</a>
<a class="Smenu_link" href="http://ucozon.ru/dir/1-0-2">Шаблоны для uCoz</a>
<a class="Smenu_link" href="http://ucozon.ru/dir/1-0-3">Все для вебмастера uCoz</a>
<a class="Smenu_link" href="http://ucozon.ru/dir/1-0-5">Графика для uCoz</a>
<a class="Smenu_link" href="http://ucozon.ru/news/1-0-6">Иконки групп для uCoz</a>
<a class="Smenu_link" href="http://mail.yandex.ru/page/pdd_add_user/pdd_add_user.xml?domain=ucozon.ru"><span style="color: red;">Завести почтовый ящик</span></a>
</td></tr><tr><td class="block_bottom"></td></tr></tbody></table>
Ссылки заменять на свой , настройка не требуется только в стиле размеры блока .
Картинки в архиве в папке img
заливаем на свой сайт картинки и вставляем ссылки в стиле на эти картинки, так же в архиве есть демо вид работы меню для этого достаточно кликнуть по menu_ucoz.html не распаковывая архив