Зддравствуйте, всех с НГ!Подскажите пожалуйста как сделать в одном стиле css рамку (border) по 1px 2-х разных цветов. Если конечно такое возможно сделать одним стилем.
Уточняю:
Немного не верно выразился, не в одном стиле, а одним классом или id.
Т.е.
.classname{
рамка разных цветов
1px один цвет
1px другой цвет
}
Невозможно.
А что у вас в блоке вложено, можно HTML код того где вы хотите это реализовать ?
С одним идентификатором возможны варианты подобные этому:
Код:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <head> <title></title> <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> <style type="text/css" media="all"><!-- * {margin:0;padding:0;} #b1 {border: 1px solid black; padding: 2px; margin: 50px;} #b1 p {border: 1px solid red;} --></style> </head> <body> <div id="b1"> * </p> </div> </body> </html>
Я просто делаю закладки на ajax, и в нажатом состоянии позарез надо двойную рамку. У меня:Originally posted by Рёга@Jan 2 2008, 19:41
[b]А что у вас в блоке вложено, можно HTML код того где вы хотите это реализовать ?
А как еще вставить один класс при нажатом состоянии, что б он был связан с первым, при этом работал одновременно с ним при наведении на область нажатия я не знаюКод:.shadetabs li a.selected{ text-decoration: none; margin-top:8px; padding-left:10px; padding-right:10px; padding-top:4px; padding-bottom:5px; margin-bottom:5px; border-right:1px solid #fff; border-left:1px solid #fff; border-top:1px solid #fff; text-decoration:none; color: #3b83c6; font-size:11px; background: white url(images/bgbg.gif) repeat-x; height:19px; }
.shadetabs li a.selected:hover {...}
.shadetabs li a.selected:active {...}
Вот код закладок:
[*] - покрывает всю область нажатияКод:<ul id="countrytabs" class="shadetabs">[*][Только зарегистрированные пользователи могут видеть ссылки. ][*][Только зарегистрированные пользователи могут видеть ссылки. ][/list]
class="shadetabs" - отвечает за вид закладок в активном и неактивном положении
Мне просто нужно что б область в нажатом состоянии была обведена 2-ой рамкой разных цветов: #первый цвет 1px и #второй цвет 1px
А вот css:
Код:.shadetabs{ padding-top: 10px; padding-left: 9px; margin-left:auto; margin-right:10px; padding-right:30px; margin-bottom: 0px; font: 11px Verdana; text-align: left; } .shadetabs li{ display: inline; padding-bottom:0px; margin-bottom:0px; } .shadetabs li a{ color:#fff; font-size:11px; text-decoration:underline; padding-right:10px; padding-left:10px; } .shadetabs li a:hover{ color:#fff; font-size:11px; text-decoration:none; } .shadetabs li a.selected{ text-decoration: none; margin-top:8px; padding-left:10px; padding-right:10px; padding-top:4px; padding-bottom:5px; margin-bottom:5px; border-right:1px solid #fff; border-left:1px solid #fff; border-top:1px solid #fff; text-decoration:none; color: #3b83c6; font-size:11px; background: white url(images/bgbg.gif) repeat-x; height:19px; } .shadetabs li a.selected:hover{ COLOR: #3b83c6; }
Подключите csshover.htc, после этого псевдокласс :hover назначьте не ссылке, а элементу[*]. Двойную рамку можно будет реализовать следующим образом: 1px для[*], 1px для вложенного в него <a>... Код не смотрел...
Ваши права
