» »

Светло желтое горизонтальное меню CSS для uCoz


Создавая сайт, всегда нужно задуматься на перед, а какая у тебя будет на сайте навигация. И здесь полностью адаптированное горизонтальное меню в светло желтом тоне. Которое подойдет как на темный или светлый фон, с темным они отлично почитаются в гамме. Но как вы заметили присутствует и синий оттенок, что можно любому это сделать, в стилях изменить.

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


Но как понимаете, по умолчанию оно будет как написано в название. Здесь просто немного изменил, чтоб вам показать, что вы можете также выставить.

Вот меню оригинал:

горизонтальное меню сайта


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

Смотрим:

Мобильное горизонтальное меню сайта


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

Переходим к установке:

Вам нужно скачать архив, потом загружаем папку ad_menu в файловый менеджер.

Далее копируем скрипт и ставим как это полагаться, вверх сайта:

Код
<link rel="stylesheet" href="/ad_menu/styles.css">  
<script src="/ad_menu/script.js"></script>  
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>  
<div id='cssmenu'>  
<ul>  
<li><a href='http://internetempire.ru/'><span>Главная</span></a></li>  
<li><a href='#'><span>Форум</span></a></li>  
<li class='has-sub'><a href='#'><span>Меню</span></a>  
<ul>  
<li class='has-sub'><a href='#'><span>Подменю 1</span></a>  
<ul>  
<li><a href='#'><span>Подменю 2</span></a></li>  
<li class='last'><a href='#'><span>Подменю 2</span></a></li>  
</ul>  
</li>  
<li class='has-sub'><a href='#'><span>Подменю 1</span></a>  
<ul>  
<li><a href='#'><span>Подменю 2</span></a></li>  
<li class='last'><a href='#'><span>Подменю 2</span></a></li>  
</ul>  
</li>  
</ul>  
</li>  
<li class='has-sub'><a href='#'><span>Меню 2</span></a>  
<ul>  
<li class='sub'><a href='#'><span>Подменю 1</span></a></li>  
<li class='sub'><a href='#'><span>Подменю 1</span></a></li>  
</ul>  
</li>  
<li class='last'><a href='#'><span>Контакты</span></a></li>  
<li class='last'><a href='#'><span>Раздел</span></a></li>  
<li class='last'><a href='#'><span>Раздел 2</span></a></li>  
</ul>  
</div>


В архиве будут идти стили, если у вас место есть в CSS то можете их скопировать и поместить туда, просто для тех кто будет менять оттенок, так намного удобнее. Когда выставите, можете обратно файл из загрузить. Идет 2 разъема на его, это вверх и низ и там вы сами сделаете, это можно посветлей выставить вверх а в низу сделать темнее и так намного красивей смотреться будет.

Источник: http://internetempire.ru/
08.03.2016 Загрузок: 12 Просмотров: 718 Комментарий: (8)

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

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

Комментарий: 8
tsakonter
tsakonter 08.03.2016 02:111
0
Костен на своей теме, не когда один цвет не представишь, просто пользователи видят, и говорят, не подходят, не зная что его можно сделать как вам нужно, а здесь еще как и вверх и низ, так вообще красиво вывести можно, что сразу видно синее так сделано.
Kosten
Kosten 08.03.2016 02:182
0
Тут не чего добавить, все правильно сказано, что хотел немного пояснить. То что если кто не сможет перевести на другой цвет или не знает как делать, пишем здесь или на форуме, ссылка в меню, все покажу как нужно делать, как знаю.
Сопрано
Сопрано 08.03.2016 02:283
+1
Мне вот желтый, но мне кажется у него другое название, тут темного хватает, но не важно. Вообщем сайт InternetEmpire.Ru нравиться, так как он в этом оттенке сделан, пусть хоть и темного хватает.
YaVi
YaVi 08.03.2016 15:276
0
Рад что хоть кому-то мой сайт нравится smile
Kosten
Kosten 08.03.2016 18:427
+1
Но по немного раскручиваешься.. с чем и поздравляю.
ucozmental
ucozmental 08.03.2016 02:474
0
Сейчас можете на новом веб мастере проверить уже на мобильное устройства, хотя что то там все дает добро, не так как на гугл, лучше просто на браузер в ручную проверить, так как горизонтальное меню, оно как понимаю и будет основой по навигаций на сайте.
Kosten
Kosten 08.03.2016 03:125
0
Но мобильная адаптация впереди, кто то ищет сразу чтоб подходило, но это вообще редкость, все делают уже на установленном каркасе сайта.
csretven
csretven 09.03.2016 20:138
0
Здесь под меню, нужно немного в серый оттенок сделать, то на светлом дизайн просто не сильно видно, это как предложение.
avatar