Верстка MineCraft-Block - uTalk Разговоры на любую тему

Страница 1 из 1
1

Верстка MineCraft-Block

Watch

Дата: Суббота, 01.12.2012, 18:53 | Сообщение # 1

Директор

Сообщений: 664

Награды: 5

Сегодня я нашел такой топик, там был выложен psd Minecraft блока + менюха.
Убив 10 минут на верстку, решил выкинуть в паблик, т.к. он мне в принципе не нужен.

Хочу заметить что размер самого блока 207px. Если у кого-то размер контейнера меньше, то он же конечно не влезет.
Но если ваш контейнер не уже 180px, тогда вы можете поставить само меню.

Демо / Архив

Теперь переходим к вкуснятине, а именно к установке блока:

Код блока (вставлять в первый или второй контейнер):

Code

<div class="block">
<div class="blockT">Меню сайта</div>
<div class="blockC">

<ul class="menu_bl">
<li><a href="/"><span>Ссылка / Верстка by z1MO_ok</span></a></li>
<li><a href="/"><span>Ссылка / Верстка by z1MO_ok</span></a></li>
<li><a href="/"><span>Ссылка / Верстка by z1MO_ok</span></a></li>
<li><a href="/"><span>Ссылка / Верстка by z1MO_ok</span></a></li>
<li><a href="/"><span>Ссылка / Верстка by z1MO_ok</span></a></li>
</ul>

</div>
<div class="blockB"></div>
</div>

Стили блока + меню:

Code

/***

       Name: Minecraft-Block
       Author: z1MO_ok
       Author contact: \ Skype: artmen_ok /
       Theme URL:
       Version: 1.0

***/

.block {width:207px;margin-bottom:7px;overflow:hidden;}
.blockT {background:url(/img/bg_block.png) no-repeat;width:207px;height:20px;padding-top:5px;color:#fff;font:11px Tahoma, Geneva, sand-serif;text-align:center;}
.blockC {background:url(/img/bg_block.png) repeat-y -207px 0;width:195px;padding:5px 6px;overflow:hidden;}
.blockB {background:url(/img/bg_block.png) no-repeat -414px 0;width:207px;height:10px;}
ul.menu_bl {list-style:none;margin:0 auto;padding:0;width:180px;}
ul.menu_bl li span {display:block;background:url(/img/menu_li.png);width:150px;height:22px;line-height:22px;padding-left:30px;overflow:hidden;}
ul.menu_bl li:hover {opacity:0.65;}
ul.menu_bl li a {color:#fff;font:10px Tahoma, Geneva, sand-serif;text-decoration:none;}

Если вам нужно само меню, но не знаете какой код нужно вырвать? Тогда открывайте спойлер ниже и там есть все необходимое.

Внимание! При копировании материала, большая просьба, указывать источник и автора работы.
Ещё хочу сказать что адаптацию блока я не тестировал. Если будут проблемы, я исправлю, только говорите что за проблемы, а не просто "НЕ РАБОТАЕТ!!!"...
C вами был z1MO_ok.

Зарабатывать хорошую репутацию можно годами, а потерять - за считанные мгновения...© KeNtOk
Послушай... и Задумайся что сказано выше...

Верстка MineCraft-Block

Страница 1 из 1
1

Мини профиль

Вторник
15.7.2025-02:55
Вы вошли как: Гость
Вы с нами: - день.

Новое на форуме

Ты веришь в КС Древняя система развития ... Древняя система развития ... Оцените аву новый год! Оцените 3D кнопочку! Макеты, Меню, Баннеры, Ло... Зимняя лотерея №1 Оцените аву Оцените логотип! Скрипт накрутки

Статистика