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

Шапка сайта для системы uCoz как на сайте EXTM

О шапки сайта:
Шапка сайта для системы uCoz как на сайте EXTM, красивая шапка модно поменять можно создать вторую шапку , кстати эта шапка подойдет к любому форуму. Так же ее можно поставить на форум сайта и у портала будет 2 шапки. И это так делают, так как по дизайну шапка сайта почти под все форумы подходит.
Приступаем к установке:
В CSS прописываем этот стиль

Код

/* Верхняя часть шапки */
.bg_top_m_l background:url(/shapka_new/bg_top_m.png) left top no-repeat;
.bg_top_m_r background:url(/shapka_new/bg_top_m.png) right -54px no-repeat;
.bg_top_m_c background:url(/shapka_new/bg_top_m.png) 0 -27px;
.bg_top_logo background:url(/shapka_new/domen.png) center no-repeat;height:22px;padding:5px 163px 0 157px;
.bg_zakaz background:url(/shapka_new/bg_zakaz.png);width:145px;height:16px;float:right;
.bg_zakaz:hover background:url(/shapka_new/bg_zakaz.png) 0 -16px;
/* ——————- */

/* Иконки верхней части */
.icon1 width:29px;height:17px;background:url(/shapka_new/bg_icons.png);float:left;
.icon1:hover width:29px;height:17px;background:url(/shapka_new/bg_icons.png) 0 -17px;

.icon2 width:29px;height:17px;background:url(/shapka_new/bg_icons.png) -29px 0;float:left;
.icon2:hover background:url(h/shapka_new/bg_icons.png) -29px -17px;

.icon3 width:29px;height:17px;background:url(/shapka_new/bg_icons.png) -58px 0;float:left;
.icon3:hover background:url(/shapka_new/bg_icons.png) -58px -17px;

.icon4 width:17px;height:17px;background:url(/shapka_new/bg_icons.png) -87px 0;margin-left:87px;
.icon4:hover background:url(/shapka_new/bg_icons.png) -87px -17px;

.icons width:104px;height:17px;
/* ——————— */

/* Центр шапки */
.head height:164px;background:#232323;
.logo background:url(/shapka_new/logo.png);height:91px;width:303px;margin:23px 0 0 74px;
.bg_rek_on width:476px;height:96px; display:block;padding:7px 0 0 7px; background:url(/shapka_new/bg_rek.png) no-repeat;float:right;margin:24px 76px 0 0;

/* Нижняя часть шапки */

.bg_bottom_m_l background:url(/shapka_new/bg_bottom_m.png) left top no-repeat;
.bg_bottom_m_r background:url(/shapka_new/bg_bottom_m.png) right -126px no-repeat;height:49px;padding:14px 158px 0 158px;
.bg_bottom_m_c background:url(/shapka_new/bg_bottom_m.png) 0 -63px;

.menu_hr background:url(/shapka_new/bg_menu_1.png) no-repeat right;height:24px;float:left;padding:0px 11px;

.menu_h margin: 0;padding: 0;float: left;border: 0px;border-width: 0px 0; z-index:99
.menu_h li display: block;float:left;position:relative;
.menu_h li a color:#fff;text-decoration:none;font:bold 8pt Arial;height:22px;padding:0 0 0 9px;float:left;
.menu_h li a span display:block;padding:5px 9px 0px 0px;
.menu_h li a:hover span background:url(/shapka_new/bg_menu_2.png) right top no-repeat;height:22px;
.menu_h li a:hover dislay:block;color:#0D6DBA;background:url(/shapka_new/bg_menu_2.png) left -22px no-repeat;height:22px;

.menu_h li:hover .menu_h_sub_c display:block;
.menu_h_sub_c width:2px;height:1px;display:none;position:absolute;left:50%;top:0;z-index:10;
.menu_h_sub width:204px;height:28px;position:absolute;left:-50px;background:url(/shapka_new/bg_pod.png) -204px 0;top:22px;margin:0;padding:28px 0 0 0;
.menu_h_sub_m background:url(/shapka_new/bg_pod.png) no-repeat left bottom;width:198px;padding:0px 3px 5px 3px;

.menu_h li .menu_h_m divheight:30px;background:none;width:167px;

.menu_h_m float:none;
.menu_h_m div a display:block;width:187px;background:url(/shapka_new/bg_menu_3.png) 0 -28px;height:23px;padding:5px 0px 0px 11px;text-align:left;color:#232323;font:normal 9pt Arial;
.menu_h_m div a:hover width:180px;background:url(/shapka_new/bg_menu_3.png) no-repeat;height:23px;color:#f1f1f1;padding:5px 0px 0px 18px;
.middle_hmenu margin:0px auto;width:750px;
/* —————— */

Верхнею часть ставим этот код:

Код
<div id=»container_wrap»>
<div id=»hnav_full»>
<div class=»head»>
<div class=»bg_top_m_c»>
<div class=»bg_top_m_l»>
<div class=»bg_top_m_r»>
<div class=»bg_top_logo»>
<div class=»icons»>
<a href=»http://csgrad.3dn.ru/load/rss» title=»RSS»><div class=»icon1″></div></a>
<a href=»http://csgrad.3dn.ru/forum/28″ title=»Правила сайта»><div class=»icon2″></div></a>
<a href=»http://csgrad.3dn.ru/forum/0-0-1-34″ title=»Ленточный вариант форума»><div class=»icon3″></div></a>
<a href=»http://csgrad.3dn.ru/forum/28-53-1″ title=»Правила форума»><div class=»icon4″></div></a>
</div>
</div>
</div>
</div>
</div>
<div class=»bg_rek_on»><script language=’JavaScript’ charset=’windows-1251′ src=’http://buy-link.ru/codes/banner.php?id=12880&s=1′></script></div>
<div class=»logo»></div>
</div>
<div class=»bg_bottom_m_c»>
<div class=»bg_bottom_m_l»>
<div class=»bg_bottom_m_r»>
<div class=»middle_hmenu»>
<ul class=»menu_h»>
<div class=»menu_hr»><li><a href=»http://csgrad.3dn.ru/»><span>Главная</span></a></li></div>
<div class=»menu_hr»><li><a href=»http://csgrad.3dn.ru/forum»><span>Форум</span></a></li></div>
<div class=»menu_hr»><li><a href=»http://csgrad.3dn.ru/load/counter_strike_1_6/6″><span>CS 1.6</span></a>
<div class=»menu_h_sub_c»>
<div class=»menu_h_sub»>
<div class=»menu_h_sub_m»>
<span class=»menu_h_m»>
<div><a href=»http://csgrad.3dn.ru/load/counter_strike_1_6/gotovye_servera_cs_1_6/27″ title=»Готовые cервера CS 1.6″ alt=»Скачать Готовые cервера CS 1.6 бесплатно»>Готовые cервера CS 1.6</a></div>
<div><a href=»http://csgrad.3dn.ru/load/counter_strike_1_6/plaginy_dlja_servera/34″ title=»Плагины для сервера» alt=»Скачать Плагины для сервера бесплатно»>Плагины для сервера</a></div>
<div><a href=»http://csgrad.3dn.ru/load/counter_strike_1_6/counter_strike_1_6/28″ title=»Counter-Strike 1.6″ alt=»Скачать Counter-Strike 1.6 бесплатно»>Counter-Strike 1.6</a></div>
<div><a href=»http://csgrad.3dn.ru/load/counter_strike_1_6/karty_dlja_cs_1_6/25″ title=»Карты для CS 1.6″ alt=»Скачать Карты для CS 1.6 бесплатно»>Карты для CS 1.6</a></div>
<div><a href=»http://csgrad.3dn.ru/load/counter_strike_1_6/soft_dlja_cs_1_6/26″ title=»Софт для CS 1.6″ alt=»Скачать Софт для CS 1.6 бесплатно»>Софт для CS 1.6</a></div>
<div><a href=»http://csgrad.3dn.ru/load/counter_strike_1_6/chity_dlja_cs_1_6/24″ title=»Читы для CS 1.6″ alt=»Скачать Читы для CS 1.6 бесплатно»>Читы для CS 1.6</a></div>
<div><a href=»http://csgrad.3dn.ru/load/counter_strike_1_6/modeli_igrokov/23″ title=»Модели игроков» alt=»Скачать Модели игроков бесплатно»>Модели игроков</a></div>
<div><a href=»http://csgrad.3dn.ru/load/counter_strike_1_6/modeli_oruzhija/22″ title=»Модели оружия» alt=»Скачать Модели оружия бесплатно»>Модели оружия</a></div>
<div><a href=»http://csgrad.3dn.ru/load/counter_strike_1_6/prochee/99″ title=»Прочее» alt=»Скачать Прочее бесплатно»>Прочее</a></div>
<div><a href=»http://csgrad.3dn.ru/load/counter_strike_1_6/patchi/35″ title=»Патчи» alt=»Скачать Патчи бесплатно»>Патчи</a></div>
<div><a href=»http://csgrad.3dn.ru/load/counter_strike_1_6/mody/98″ title=»Моды» alt=»Скачать Моды бесплатно»>Моды</a></div>
<div><a href=»http://csgrad.3dn.ru/load/counter_strike_1_6/boty/36″ title=»Боты» alt=»Скачать Боты бесплатно»>Боты</a></div>
</span>
</div>
</div>
</div>
</div>
<div class=»menu_hr»><li><a href=»http://csgrad.3dn.ru/load/cs_source/10″><span>CSS</span></a>
<div class=»menu_h_sub_c»>
<div class=»menu_h_sub»>
<div class=»menu_h_sub_m»>
<span class=»menu_h_m»>
<div><a href=»http://csgrad.3dn.ru/load/cs_source/gotovye_servera_cs_s/33″ title=»Готовые сервера CS:S» alt=»Скачать Готовые сервера CS:S бесплатно»>Готовые сервера CS:S</a></div>
<div><a href=»http://csgrad.3dn.ru/load/cs_source/counter_strike_source/49″ title=»Counter-Strike Source» alt=»Скачать Counter-Strike Source бесплатно»>Counter-Strike Source</a></div>
<div><a href=»http://csgrad.3dn.ru/load/cs_source/plaginy_dlja_servera/37″ title=»Плагины для сервера» alt=»Скачать Плагины для сервера бесплатно»>Плагины для сервера</a></div>
<div><a href=»http://csgrad.3dn.ru/load/cs_source/temy_menju_cs_s/38″ title=»Темы меню CS:S» alt=»Скачать Темы меню CS:S бесплатно»>Темы меню CS:S</a></div>
<div><a href=»http://csgrad.3dn.ru/load/cs_source/modeli_igrokov/30″ title=»Модели игроков» alt=»Скачать Модели игроков бесплатно»>Модели игроков</a></div>
<div><a href=»http://csgrad.3dn.ru/load/cs_source/modeli_oruzhija/29″ title=»Модели оружия» alt=»Скачать Модели оружия бесплатно»>Модели оружия</a></div>
<div><a href=»http://csgrad.3dn.ru/load/cs_source/karty_dlja_cs_s/32″ title=»Карты для CS:S» alt=»Скачать Карты для CS:S бесплатно»>Карты для CS:S</a></div>
<div><a href=»http://csgrad.3dn.ru/load/cs_source/chity_dlja_cs_s/31″ title=»Читы для CS:S» alt=»Скачать Читы для CS:S бесплатно»>Читы для CS:S</a></div>
</span>
</div>
</div>
</div>
</div>
<div class=»menu_hr»><li><a href=»http://csgrad.3dn.ru/load/sistema_ucoz/7″><span>uCoz</span></a>
<div class=»menu_h_sub_c»>
<div class=»menu_h_sub»>
<div class=»menu_h_sub_m»>
<span class=»menu_h_m»>
<div><a href=»http://csgrad.3dn.ru/load/sistema_ucoz/shablony_dlja_ucoz/11″ title=»Шаблоны для uCoz» alt=»Скачать Шаблоны для uCoz бесплатно»>Шаблоны для uCoz</a></div>
<div><a href=»http://csgrad.3dn.ru/load/sistema_ucoz/skripty_dlja_ucoz/12″ title=»Скрипты для uCoz» alt=»Скачать Скрипты для uCoz бесплатно»>Скрипты для uCoz</a></div>
<div><a href=»http://csgrad.3dn.ru/load/sistema_ucoz/ikonki_dlja_foruma/13″ title=»Иконки для форума» alt=»Скачать Иконки для форума бесплатно»>Иконки для форума</a></div>
<div><a href=»http://csgrad.3dn.ru/load/sistema_ucoz/ikonki_dlja_grupp/14″ title=»Иконки для групп» alt=»Скачать Иконки для групп бесплатно»>Иконки для групп</a></div>
<div><a href=»http://csgrad.3dn.ru/load/sistema_ucoz/shapki_dlja_sajta/15″ title=»Шапки для сайта» alt=»Скачать Шапки для сайта бесплатно»>Шапки для сайта</a></div>
</span>
</div>
</div>
</div>
</div>
<div class=»menu_hr»><li><a href=»http://csgrad.3dn.ru/load/photoshop/9″><span>Photoshop</span></a>
<div class=»menu_h_sub_c»>
<div class=»menu_h_sub»>
<div class=»menu_h_sub_m»>
<span class=»menu_h_m»>
<div><a href=»http://csgrad.3dn.ru/load/photoshop/gotovye_psd_raboty/18″ title=»Готовые PSD работы» alt=»Скачать Готовые PSD работы бесплатно»>Готовые PSD работы</a></div>
<div><a href=»http://csgrad.3dn.ru/load/photoshop/skachat_photoshop/48″ title=»Скачать PhotoShop» alt=»Скачать PhotoShop бесплатно»>Скачать PhotoShop</a></div>
<div><a href=»http://csgrad.3dn.ru/forum/18″ title=»Уроки по PS» alt=»Уроки по PS»>Уроки по PS</a></div>
<div><a href=»http://csgrad.3dn.ru/load/photoshop/gradienty/21″ title=»Градиенты» alt=»Скачать Градиенты бесплатно»>Градиенты</a></div>
<div><a href=»http://csgrad.3dn.ru/load/photoshop/shrifty/17″ title=»Шрифты» alt=»Скачать Шрифты бесплатно»>Шрифты</a></div>
<div><a href=»http://csgrad.3dn.ru/load/photoshop/stili/20″ title=»Стили» alt=»Скачать Стили бесплатно»>Стили</a></div>
<div><a href=»http://csgrad.3dn.ru/load/photoshop/kisti/16″ title=»Кисти» alt=»Скачать Кисти бесплатно»>Кисти</a></div>
</span>
</div>
</div>
</div>
</div>
<div class=»menu_hr»><li><a href=»http://csgrad.3dn.ru/load/minecraft/100″><span>MineCraft</span></a>
<div class=»menu_h_sub_c»>
<div class=»menu_h_sub»>
<div class=»menu_h_sub_m»>
<span class=»menu_h_m»>
<div><a href=»http://csgrad.3dn.ru/load/minecraft/gotovye_servera/102″ title=»Готовые сервера» alt=»Скачать Готовые сервера бесплатно»>Готовые сервера</a></div>
<div><a href=»http://csgrad.3dn.ru/load/minecraft/tekstury/104″ title=»Текстуры» alt=»Скачать Текстуры бесплатно»>Текстуры</a></div>
<div><a href=»http://csgrad.3dn.ru/load/minecraft/plaginy/103″ title=»Плагины» alt=»Скачать Плагины бесплатно»>Плагины</a></div>
<div><a href=»http://csgrad.3dn.ru/load/minecraft/klient/101″ title=»Клиент» alt=»Скачать Клиент бесплатно»>Клиент</a></div>
<div><a href=»http://csgrad.3dn.ru/load/minecraft/raznoe/107″ title=»Разное» alt=»Скачать Разное бесплатно»>Разное</a></div>
<div><a href=»http://csgrad.3dn.ru/load/minecraft/karty/106″ title=»Карты» alt=»Скачать Карты бесплатно»>Карты</a></div>
<div><a href=»http://csgrad.3dn.ru/load/minecraft/mody/105″ title=»Моды» alt=»Скачать Моды бесплатно»>Моды</a></div>
</span>
</div>
</div>
</div>
</div>
<div class=»menu_hr»><li><a href=»http://csgrad.3dn.ru/load/igry/93″><span>Игры</span></a>
<div class=»menu_h_sub_c»>
<div class=»menu_h_sub»>
<div class=»menu_h_sub_m»>
<span class=»menu_h_m»>
<div><a href=»http://csgrad.3dn.ru/load/igry/igry_dlja_pc/94″ title=»Игры для PC» alt=»Скачать Игры для PC бесплатно»>Игры для PC</a></div>
<div><a href=»http://csgrad.3dn.ru/load/igry/igry_dlja_psp/95″ title=»Игры для PSP» alt=»Скачать Игры для PSP бесплатно»>Игры для PSP</a></div>
<div><a href=»http://csgrad.3dn.ru/load/igry/igry_dlja_ps2/96″ title=»Игры для PS2″ alt=»Скачать Игры для PS2 бесплатно»>Игры для PS2</a></div>
<div><a href=»http://csgrad.3dn.ru/load/igry/igry_dlja_xbox360/97″ title=»Игры для XBox360″ alt=»Скачать Игры для XBox360 бесплатно»>Игры для XBox360</a></div>
</span>
</div>
</div>
</div>
</div>
<div class=»menu_hr»><li><a href=»http://csgrad.3dn.ru/load/team_foress_2/55″><span>TF 2</span></a>
<div class=»menu_h_sub_c»>
<div class=»menu_h_sub»>
<div class=»menu_h_sub_m»>
<span class=»menu_h_m»>
<div><a href=»http://csgrad.3dn.ru/load/team_foress_2/gotovye_servera/82″ title=»Готовые сервера» alt=»Скачать Готовые сервера бесплатно»>Готовые сервера</a></div>
<div><a href=»http://csgrad.3dn.ru/load/team_foress_2/modeli/85″ title=»Модели» alt=»Скачать Модели бесплатно»>Модели</a></div>
<div><a href=»http://csgrad.3dn.ru/load/team_foress_2/klient/81″ title=»Клиент» alt=»Скачать Клиент бесплатно»>Клиент</a></div>
<div><a href=»http://csgrad.3dn.ru/load/team_foress_2/karty/84″ title=»Карты» alt=»Скачать Карты бесплатно»>Карты</a></div>
<div><a href=»http://csgrad.3dn.ru/load/team_foress_2/mody/83″ title=»Моды» alt=»Скачать Моды бесплатно»>Моды</a></div>
</span>
</div>
</div>
</div>
</div>
<div class=»menu_hr»><li><a href=»http://www.exe-up.ru/load/left_4_dead_2/52″><span>L4D</span></a>
<div class=»menu_h_sub_c»>
<div class=»menu_h_sub»>
<div class=»menu_h_sub_m»>
<span class=»menu_h_m»>
<div><a href=»http://csgrad.3dn.ru/load/left_4_dead_2/skachat_left_4_dead_2/64″ title=»Скачать Left 4 Dead» alt=»Скачать Left 4 Dead бесплатно»>Скачать Left 4 Dead</a></div>
<div><a href=»http://csgrad.3dn.ru/load/left_4_dead_2/gotovye_servera/65″ title=»Готовые сервера» alt=»Скачать Готовые сервера бесплатно»>Готовые сервера</a></div>
<div><a href=»http://csgrad.3dn.ru/load/left_4_dead_2/programmy/69″ title=»Программы» alt=»Скачать Программы бесплатно»>Программы</a></div>
<div><a href=»http://csgrad.3dn.ru/load/left_4_dead_2/plaginy/66″ title=»Плагины» alt=»Скачать Плагины бесплатно»>Плагины</a></div>
<div><a href=»http://csgrad.3dn.ru/load/left_4_dead_2/modeli/70″ title=»Модели» alt=»Скачать Модели бесплатно»>Модели</a></div>
<div><a href=»http://csgrad.3dn.ru/load/left_4_dead_2/karty/68″ title=»Карты» alt=»Скачать Карты бесплатно»>Карты</a></div>
<div><a href=»http://csgrad.3dn.ru/load/left_4_dead_2/mody/67″ title=»Моды» alt=»Скачать Моды бесплатно»>Моды</a></div>
<div><a href=»http://csgrad.3dn.ru/load/left_4_dead_2/prochee/71″ title=»Прочее» alt=»Скачать Прочее бесплатно»>Прочее</a></div>
</span>
</div>
</div>
</div>
</li>
</div>
</ul>
</div>
</div>
</div>
</div>
<div id=»content_full» class=»content_all_full»>
источник: zornet.ru

Похожие посты