|
|
Модератор форума: dotbot |
Сообщество uCoz » Архивариус » Корзина » Отдельный css стиль, для отдельной части дизайна (Возможно ли менять пересекающие стили) |
Отдельный css стиль, для отдельной части дизайна |
РЕШЕНО
Столкнулся с такой проблемой: Нашел меню, которое хочу поставить на свой сайт neodmin.ru. Как видно из кода этого меню, в нем присутствуют теги <ul> и <li>. Установив его в стандартный файл css у меня сыпятся (принимают стили этого меню) остальные части дизайна где используются теги <ul>, <li>. Вопрос: возможно ли прописать стили для меню (отдельным файлом или скриптом), чтобы они не пересекались со стандартными стилями этих тегов?? через <style> стиль </style> не поможет это уж точно Буду очень признателен за помощь. Прикрепления:
4205148.png
(189.6 Kb)
·
5302831.png
(122.3 Kb)
в юзабилити необходим - как набраться опыта и креативного мышления
Сообщение отредактировал neodmin - Пятница, 01 Авг 2014, 18:49:29
|
Может я чего не догоняю. В стилях меню прописываются новые значения для этих тегов: Код nav { width: 100%; height: 80px; background: #222; } [color=#980000]ul { text-align: center; } ul li { font: 13px Verdana, 'Lucida Grande'; cursor: pointer; -webkit-transition: padding .05s linear; -moz-transition: padding .05s linear; -ms-transition: padding .05s linear; -o-transition: padding .05s linear; transition: padding .05s linear; } ul li.drop { position: relative; } ul > li { display: inline-block; } ul li a { line-height: 80px; padding: 0 20px; height: 80px; color: #777; -webkit-transition: all .1s ease-out; -moz-transition: all .1s ease-out; -ms-transition: all .1s ease-out; -o-transition: all .1s ease-out; transition: all .1s ease-out; } ul li a:hover { color: #eee; } .dropOut .triangle { width: 0; height: 0; position: absolute; border-left: 8px solid transparent; border-right: 8px solid transparent; border-bottom: 8px solid white; top: -8px; left: 50%; margin-left: -8px; } .dropdownContain { width: 160px; position: absolute; z-index: 2; left: 50%; margin-left: -80px; /* half of width */ top: -400px; } .dropOut { width: 160px; background: white; float: left; position: relative; margin-top: 0px; opacity: 0; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; -webkit-box-shadow: 0 1px 6px rgba(0,0,0,.15); -moz-box-shadow: 0 1px 6px rgba(0,0,0,.15); box-shadow: 0 1px 6px rgba(0,0,0,.15); -webkit-transition: all .1s ease-out; -moz-transition: all .1s ease-out; -ms-transition: all .1s ease-out; -o-transition: all .1s ease-out; transition: all .1s ease-out; } .dropOut ul { float: left; padding: 10px 0; } .dropOut ul li { text-align: left; float: left; width: 125px; padding: 12px 0 10px 15px; margin: 0px 10px; color: #777; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; -webkit-transition: background .1s ease-out; -moz-transition: background .1s ease-out; -ms-transition: background .1s ease-out; -o-transition: background .1s ease-out; transition: background .1s ease-out; } .dropOut ul li:hover { background: #f6f6f6; } [color=#980000]ul li:hover a { color: white; } ul li:hover .dropdownContain { top: 65px; } ul li:hover .underline { border-bottom-color: #777; } ul li:hover .dropOut { opacity: 1; margin-top: 8px; } в юзабилити необходим - как набраться опыта и креативного мышления
|
В том-то и дело, что Вы прописываете отображение ul и li для всего сайта в целом, естественно, они будут везде так, как здесь:
Код nav { width: 100%; height: 80px; background: #222; } [color=#980000]ul { text-align: center; } ul li { font: 13px Verdana, 'Lucida Grande'; cursor: pointer; -webkit-transition: padding .05s linear; -moz-transition: padding .05s linear; -ms-transition: padding .05s linear; -o-transition: padding .05s linear; transition: padding .05s linear; } ul li.drop { position: relative; } ul > li { display: inline-block; } ul li a { line-height: 80px; padding: 0 20px; height: 80px; color: #777; -webkit-transition: all .1s ease-out; -moz-transition: all .1s ease-out; -ms-transition: all .1s ease-out; -o-transition: all .1s ease-out; transition: all .1s ease-out; } ul li a:hover { color: #eee; } Попробуйте обернуть меню <div>, например, для этого дива задать отдельный класс и уже в приведённый код CSS этот класс добавить. А общие настройки для ul и li, которые раньше были, оставить как было. Писать - глагол, относящийся к I спряжению:
Я пишУ. Ты пишЕшь. Он пишЕт. Мы ПишЕм. Вы ПишЕТЕ. Они пишУт. Неужели так сложно это запомнить??? |
Попробуйте обернуть меню <div>, например, для этого дива задать отдельный класс и уже в приведённый код CSS этот класс добавить. А общие настройки для ul и li, которые раньше были, оставить как было. От души спасибо! =) Долго мучаюсь с шаблоном, с таким еще не сталкивался. в юзабилити необходим - как набраться опыта и креативного мышления
|
Он в нижнем меню. Но Вас понял, исправлю. не думал, что таким образом нельзя в юзабилити необходим - как набраться опыта и креативного мышления
|
| |||
| |||