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

Вертикальное меню с кнопкой на uCoz

Вертикальное меню с кнопкой на uCoz
Не чем не отличающиеся в навигаций и по сути простое меню на сайт. Которое можно поставить на навигацию по ресурс или лучше на блог фиксированной шириной. Есть кнопки, которые при наведение меняются оттенком цвета. Под стандартные шаблоны, оно отличное решение, по смене, что идет по умолчанию. Здесь представлено на на темном фоне и немного кнопки перекрашены.

А также демонстрация с источника, это как пример, что уже будет установлено в самом блоке. На нем можно вывести основные функций на сайте, как обратная связь или категорий, и больше всего можно увидеть его самым первым в контейнере портала. Вообщем как понимаете, чем проще, тем понятнее, что и относится эта навигация по своим стандартам.

Установка:

Код:

Код
<div class="links">  
  <li><a href="/">Страница сайта</a></li>  
  <li><a href="/load">Файлы сайта</a></li>  
  <li><a href="/news">Новости на портале</a></li>  
  <li><a href="/publ">Актуальные статьи</a></li>  
  <li><a href="/blog">Виде обзор роликов</a></li>  
  <li><a href="/board">Игровые новости</a></li>  
  <li><a href="/forum">Форум на вашем сайте</a></li>  
  <li><a href="/faq">Ответы на ваши вопросы</a></li>  
  <li><a href="/">Прямая связь с Амином</a></li>  
  </div>

CSS: Так можно поставить ниже кода, или убераем в начале и в конце style и ставим в CSS на сайте.

Код
<style>
.links li {list-style: none; font-size: 10pt; margin: 5px 0;font: 12px/16px 'Arial';}  
.links li a {background: url('/Aben/Rudsa/15-76.png') no-repeat 0 2px; padding: 0 0 0 20px; color: #808080;text-decoration: none;}  
.links li a:hover {background-position: 0 -28px; color: #000;}
</style>


Смотрим DEMO на темном фоне, как реально идет код:

Меню сайта на темном фоне  

Здесь уже в блоке стоит код и примерно, можно понимать как на сайте будет.

Вертикально меню сайта на светлом фоне

PS - идет с ним в стилях одна ссылка, это кнопки, где можно поменять оттенок, что сделана в первом случай, также стили настройки, это при наведение на надпись.

Источник: www.csomsk.ru
24 Октября 2016 Просмотров: 2220 Комментариев: (3)

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

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

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

Комментарии: 3
Сопрано
Сопрано 24 Октября 2016 19:011
0
Меню больше на категорий подойдет.
Tergran
Tergran 25 Октября 2016 19:202
0
Под категорий вообще не нужно делать, разве, что в красивом дизайн, а эта навигация на блог или на один модуль, кроме форума, и то там можно иногда заметить, что блоки стоят, то подойдет.
Kosten
Kosten 25 Октября 2016 23:113
0
Но это навигация, и можно даже сравнить с стандартной, только немного эффекта добавлена. Здесь кому как нравится, кому большая и заметная, кому как раз вот такая, чтоб все только в сам сайт вписывалось.
avatar