|
|
Регистрация Восстановить пароль |
Повторная активизация e-mail |
Регистрация | Задать вопрос |
Заплачу за решение |
Новые сообщения |
Сообщения за день |
Расширенный поиск |
Правила |
Всё прочитано |
|
Опции темы | Поиск в этой теме |
03.02.2014, 12:42 | #1 |
Регистрация: 12.06.2012
Сообщений: 8
|
Управление вкладками через CSS
Добрый день, помогите разобраться с отображением вкладок. Есть две вкладки: Вкладка1 и Вкладка2. В вкладках содержится информация. В вкладке2 есть еще две вкладки: Вкладка3 и Вкладка4. На данный момент стиль настроен так, что отображается информация вкладок 2, 3, 4 на Вкладке1, а не должна. Ниже html и css код.
html-файл: Код HTML:
<!DOCTYPE html> <html> <head><meta charset="utf-8"> <link rel="stylesheet" type="text/css" href="style.css" /> </head> <body> <div class="tabsLink"> <a href="#tab1">Вкладка 1</a> <a href="#tab2">Вкладка 2</a> </div> <br /> <a class="tabs" id="tab1"></a> <div class="tab">Вкладка 1 <br /> </div> <a class="tabs3" id="tab2"></a> <div class="tab3">Вкладка 2 <br /> Текст <br /> <div class="tabsLink"> <a href="#tab2_1">Вкладка 2_1</a> <a href="#tab2_2">Вкладка 2_2</a> </div> <br /> <a class="tabs1" id="tab2_1"></a> <div class="tab1">Вкладка 2_1 <br /> Информация для вкладки 2_1</div> <a class="tabs1" id="tab2_2"></a> <div class="tab1">Вкладка 2_2 <br /> Информация для вкладки 2_2</div> </div> </body> </html> Код HTML:
/*.tabs, .tabs3 {*/ .tabs, tabs3, .tabs1{ opacity: 0; /* Прозрачность */ visibility: hidden; /* Изначально - спрятан */ } /*.tab, .tab3{*/ .tab, .tab3, .tab1{ position:absolute; /* Абсолютное позиционирование */ visibility: hidden; /* Изначально - спрятан */ z-index: 10; /* z-index */ /*color:#478CFB; /* Цвет */ font: bold 12pt "Trebuchet MS", tahoma, verdana, arial narrow, arial; /* Толщина, размер и семейство шрифта */ } .tabs:target+.tab{ opacity: 1; /* Убирает прозрачность */ visibility: visible; color:#000000; } /*.tabs1 { opacity: 0; /* Прозрачность visibility: hidden; /* Изначально - спрятан }*/ /*.tab1{ position:absolute; /* Абсолютное позиционирование */ /*visibility: hidden; /* Изначально - спрятан */ /*z-index: 10; /* z-index */ /*color:#478CFB; /* Цвет */ /*font: bold 12pt "Trebuchet MS", tahoma, verdana, arial narrow, arial; /* Толщина, размер и семейство шрифта */ /*}*/ .tabs3:target+.tab3 { opacity: 1; /* Убирает прозрачность */ visibility: visible; color:#000000; } .tabs1:target + .tab1, .tab3{ opacity: 1; /* Убирает прозрачность */ visibility: visible; color:#000000; } |
Похожие темы | ||||
Тема | Автор | Раздел | Ответов | Последнее сообщение |
управление через Socket | Plumazh | Работа с сетью в Delphi | 9 | 10.09.2013 14:39 |
Управление вкладками браузера | Aleskandr | JavaScript, Ajax | 0 | 28.01.2013 10:39 |
Управление вкладками WebBrowser | Manson_0 | C# (си шарп) | 1 | 28.06.2012 00:40 |
Управление псевдоэлементами css средствами javascript | Naive | JavaScript, Ajax | 5 | 01.03.2012 15:27 |
Управление через лан | yura-cat | Помощь студентам | 7 | 23.09.2008 00:26 |