ZorNet.Ru — сайт для вебмастера » Меню для сайта » Горизонтальное меню плюс логотип для uCoz

Горизонтальное меню плюс логотип для uCoz

Это красиво сделано темного горизонтальное меню под сайта uCoz. На нем с левой стороны будет логотип а также формы созданы специально под разделы вашего ресурса. Можно сказать даже кнопки, так как под них идут стили и вы можете вывести оттенок и главное сделать шикарный обвод на них. Безусловно логотип будет под ссылку и при наведение его небольшой эффект произойдет.

С ним идут 2 ссылки, это фон, что вы можете изменить и сама картинка под логотип, что безусловно вам обязательно нужно менять. Хотел сделать чисто под темно синий оттенок, но черная гамма больше востребована.

Установка:

Сам код, но основном, это вверх сайта и в самый его потолок:

Код

<div class="ie-nav">
<div class="ie-full">
<a href="/" class="ie-logo"></a>
<ul class="ie-nav">
<li><a href="/">Главная сайта</a></li>
<li><a href="#">Форум сайта</a></li>
<li><a href="#">Шаблоны разные</a></li>
<li><a href="#">Скрипты рабочие</a></li>
<li><a href="#">Информеры</a></li>
<li><a href="#">PSD исходники</a></li>
<li><a href="#">CSS Элементы</a></li>
</ul>
</div>
</div>

CSS:

Код

.ie-full {
  width:1140px;
  margin:0 auto;
}

.ie-nav {
  background:url(/ie_gormenu/ie-nav.png) repeat-x 0 0;
  height:89px;
  overflow:hidden;
}

a.ie-logo {
  background:url(/ie_gormenu/ie-logo.png) no-repeat 0 0;
  width:207px;
  height:51px;
  display:block;
  float:left;
  margin:17px 0 0 -30px;
  transition:all 0.3s ease;
}

a.ie-logo:hover {
  opacity:0.5;
}

ul.ie-nav {
  float:right;
  height:37px;
  margin:25px -30px 0 0;

}

ul.ie-nav li {
  float:left;
  height:33px;
  margin:0 0 0 15px;
  display:block;
}

ul.ie-nav li a {
  text-decoration:none;
  display:block;
  height:33px;
  line-height:34px;
  padding:0 13px;
  font-size:16px;
  color: #fff;
  border: 2px solid #333;
  border-radius:10px;
  transition:all 0.3s ease;
  font-family:'Cuprum';
}

ul.ie-nav li a:hover,
ul.ie-nav li.active a {
  background: #4761C7;
  border: 2px solid #1C3B71;
  border-bottom: 2px solid #0C2552;
  color:#fff;
}

Скачиваем архив и папку ie_gormenu закидываем файловый менеджер.

Подойдет как можно увидеть под любую тему, здесь только нет под меню, но так отлично смотрится.
Источник: http://internetempire.ru/

10 Февраля 2016 Загрузок: 26 Просмотров: 3359 Комментариев: (7)

Поделиться в социальных сетях

СКАЧАТЬ

Материал разместил

Kosten

Похожие материалы

Оставь свой отзыв

Комментарии: 7
Порядок вывода комментариев: tsakonter 10 Февраля 2016 00:16¹ 0 Больше всего адаптированное меню, так как у uCoz все всегда стандартно, меньше стилей, здесь все четко сделано и нормально место под логотип оставили. Kvint 10 Февраля 2016 00:20³ 0 Это точно, меньше стилей, главное работает. Canon 10 Февраля 2016 00:18² 0 Нормально сделано. Сафрон 10 Февраля 2016 00:27⁵ 0 Когда стили присутствуют, то всегда красиво сделано. Сопрано 10 Февраля 2016 00:24⁴ 0 Кому нужно с другим оттенком, то темно желтый, то на источнике такой можете скачать. Kosten 10 Февраля 2016 00:29⁶ 0 Чтоб не искали, вот это горизонтальное меню, только вместо синего, темно желтая гамма цвета. Также как написано, можете сами выставить, но придется фотошоп применить, если панель саму под другой цвет делать. Maryges 10 Февраля 2016 00:32⁷ 0 Вот и поменяю свое старое меню, хотя почти похоже, но это явно намного лучше смотреться будет. Это можно сказать простое меню, на которое всего 2 ссылки идут, это логотип, что обязательно, но сейчас можно сделать и без него, но что удивительно сам фон, что давно на CSS перекинули.