|
Как растянуть горизонтальное меню на сайте uCoz
|
|
| Kosten | Пятница, 29 Мая 2015, 00:28 | Сообщение 1 |
| Все испробовал и так не смог растянуть горизонтальное меню. Кажется в стилях все понятно, но оно не растягивается, а просто дублируется. Кто может знает как совладать и прописать правильно стили.
Код <ul class="menu"> <li><a class="first" href="/">Главная</a></li> <li><a href="/">Скрипты сайта</a></li> <li><a href="/">ZORNET.RU</a></li> <li><a href="/">Блог</a></li> <li><a href="/">Шаблоны сайта</a></li> <li><a href="/">Все для uCoz</a></li> <li><a href="/">Дизайн сайта</a></li> <li><a href="/">Связь</a></li> </ul>
Это стили:
Код ul.menu {list-style:none;padding:0;margin:0;width:1041px;height:36px;line-height:300%;font-weight:600;background:url('http://zornet.ru/CSS-ZORNET/ZER-1/back.jpg');font-size:12px; font-family:Tahoma;
}
ul.menu li {float:left;position:relative;height:36px;background:url('http://zornet.ru/CSS-ZORNET/ZER-1/separator.png') top right no-repeat;}
ul.menu li a {background:url('http://zornet.ru/CSS-ZORNET/ZER-1/href.png') top center no-repeat;color:#A8FCFF;text-decoration:none;display:block;height:36px;padding:0 11px;margin-right:3px;overflow:hidden;text-shadow:0 1px 1px #000;}
ul.menu li a.first {background:none;}
ul.menu li a:hover {background:url('http://zornet.ru/CSS-ZORNET/ZER-1/hover.png') top center no-repeat;}
Здесь: DEMO
| | [ RU ] |
| |
| First-1 | Пятница, 29 Мая 2015, 01:16 | Сообщение 2 |
| Kosten, Как вариант это в фотошопе, меню не резиновое и нужно тянуть картинку....
| | [ UA ] |
| |
| Kosten | Пятница, 29 Мая 2015, 01:19 | Сообщение 3 |
|
| First, привет, все понятно. То все испробовал, не чего не помогает в плане растяжке, дубль идет и все, на фиксированный сайт подойдет.
| | [ RU ] |
| |
| ๖ۣۜInspire | Суббота, 30 Мая 2015, 00:42 | Сообщение 4 |
| Код ul.menu{
background: url(http://zornet.ru/left.jpg) no-repeat left, url(http://zornet.ru/right.jpg) no-repeat right, url(http://zornet.ru/center.jpg);
}
вот так
Моё портфолио
| | [ RU ] |
| |
| Kosten | Суббота, 30 Мая 2015, 01:11 | Сообщение 5 |
|
| ๖ۣۜInspire, что то не получается, ๖ۣۜInspire, дай полные стили.
| | [ RU ] |
| |
| ๖ۣۜInspire | Суббота, 30 Мая 2015, 01:20 | Сообщение 6 |
|
| Код ul.menu {list-style:none;padding:0;margin:0;width:1041px;height:36px;line-height:300%;font-weight:600;background: url('http://zornet.ru/left.jpg') no-repeat left, url('http://zornet.ru/right.jpg') no-repeat right, url('http://zornet.ru/center.jpg'); ;font-size:12px; font-family:Tahoma;
}
Моё портфолио
| | [ RU ] |
| |
| Kosten | Суббота, 30 Мая 2015, 02:19 | Сообщение 7 |
|
| ๖ۣۜInspire, вот что получилось, это безусловно стало растянутое или как говорят резиновое меню. И была изменена сама суть его, это основа стала темнее , а вот навигация в желтом оттенке и можете посмотреть что вышло, код ниже приведен.
Только с такими стилями, что сразу видно изменился дизайн, а надо было, немного сделать потемней и сами треугольники создать намного ярче и совершенно другой обзор, где можно установить даже на игровой сайт.
Код <ul class="menu"> <li><a class="first" href="http://zornet.ru/">Главная</a></li> <li><a href="http://zornet.ru/">Скрипты сайта</a></li> <li><a href="http://zornet.ru/">ZORNET.RU</a></li> <li><a href="http://zornet.ru/">Блог</a></li> <li><a href="http://zornet.ru/">Шаблоны сайта</a></li> <li><a href="/">Все для uCoz</a></li> <li><a href="/">Дизайн сайта</a></li> <li><a href="/">Связь</a></li> </ul>
Стили:
Код ul.menu {list-style:none;padding:0;margin:0;width: inherit;height:36px;line-height:300%;font-weight:600;background: url('http://zornet.ru/SKRIPT/Menu/left.jpg') no-repeat left, url('http://zornet.ru/SKRIPT/Menu/right.jpg') no-repeat right, url('http://zornet.ru/SKRIPT/Menu/center.jpg'); ;font-size:12px; font-family:Tahoma;
}
ul.menu li {float:left;position:relative;height:36px;background:url('http://zornet.ru/SKRIPT/Menu/separator.png') top right no-repeat;}
ul.menu li a {background:url('http://zornet.ru/SKRIPT/Menu/href.png') top center no-repeat;color:#F3FFA6;text-decoration:none;display:block;height:36px;padding:0 11px;margin-right:3px;overflow:hidden;text-shadow:0 1px 1px #000;}
ul.menu li a.first {background:none;}
ul.menu li a:hover {background:url('http://zornet.ru/SKRIPT/Menu/hover-6754.png') top center no-repeat;}
| | [ RU ] |
| |
| ๖ۣۜInspire | Суббота, 30 Мая 2015, 15:06 | Сообщение 8 |
|
| ну так так и нужно было, я скинул то что нужно было заменить
Моё портфолио
| | [ RU ] |
| |
| Kosten | Суббота, 30 Мая 2015, 21:26 | Сообщение 9 |
|
| ๖ۣۜInspire, я просил полный стиль 
| | [ RU ] |
| |
