|
|||
Registerkarte mit Pseudoklasse target braucht letzten Schliff
Hallo miteinander,
ich mache für eine Veranstaltung fürs Studium eine Website. Hier habe ich auf einigen Seiten eine Registerkarte integriert. Ich habe sie auch schon optisch auf meine Wünsche angepasst. Mein Problem: Es wird immer solange noch nirgends drauf geklickt wurde der letzte Tab der Registerkarte angezeigt (also der Text drin). Ich hätte aber gerne, dass sobald man auf die Seite kommt automatisch der erste Tab aktiviert wird. Ich hoffe mir kann hier jemand weiterhelfen. Ich habe noch nicht so viel Erfahrung mit Pseudoklassen, habe aber auch keine Zeit mehr das ganze nochmal zu ändern. HTML-Code:
<div class="tabs"> <div id="tab1"> <a href="#tab1">Rahmen</a> <div><ul class="registerinhalt"> <li> Termin: auf Anfrage </li> </ul></div> </div> <div id="tab2"> <a href="#tab2">Leistungen</a> <div><p class="registerinhalt">eine geführte Canadiertour inkl. Lunch, Material und Sicherheitsausrüstung (Schlauchboot, Neoprenanzug, Helm und Schwimmweste)</p></div> </div> <div id="tab3"> <a href="#tab3">Voraussetzungen</a> <div><p class="registerinhalt">Schwimmkenntnisse, normale körperliche Fitness, Teamgeist.</p></div> </div> <div id="default2"> <a href="#default2">Sonstiges</a> <div><p class="registerinhalt">Wir helfen gerne bei der Suche nach einer passenden Unterkunft.</p></div> </div> </div> Code:
ul.registerinhalt li {list-style-type:none;padding-left:15px;padding-top:15px;font-size:0.9em;font-family:Arial, Helvetica, sans-serif;} p.registerinhalt {list-style-type:none;padding-left:15px;padding-top:15px;font-size:0.9em;line-height:150%;font-family:Arial, Helvetica, sans-serif;} div.tabs { height: 245px; position: relative; line-height: 1; z-index: 0; width:555px;margin-right:15px; font-family:Arial, Helvetica, sans-serif;margin-bottom:30px;} div.tabs > div { display: inline} div.tabs > div > a {font-size:0.9em; color: #2A0A1B; background: #CCC; padding: 0.2em;text-decoration:none; border-bottom: 0.1em solid #CCC;-moz-border-radius-topleft: 5px; -moz-border-radius-topright: 5px; -webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 5px;} div.tabs > div:not(:target) > a { border-bottom: none; background:#d5c9b9;} div.tabs > div:target > a,:target #default2 > a { border-bottom: 0.1em solid #fffaf0; background: #fffaf0; text-decoration: none;} div.tabs > div > div { background: #fffaf0; z-index: -2; left: 0; top: 1.3em; bottom: 0; right: 0; overflow: visible; padding: 0.3em; -moz-border-radius-bottomleft: 15px; -moz-border-radius-bottomright: 15px; -webkit-border-bottom-left-radius: 15px; -webkit-border-bottom-right-radius: 15px;-moz-border-radius-topright: 15px; -webkit-border-top-right-radius: 15px; background-color:white} div.tabs > div:not(:target) > div { position: absolute } div.tabs > div:target > div, :target #default2 > div { position: absolute; z-index: -1} Danke für eure Hilfe!! isabella |
Sponsored Links |
Sponsored Links |
Stichwörter |
css, kartei, pseudoklassen, register |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Workaround für :target im IE | gaby | CSS | 16 | 10.07.2011 13:00 |
caa target auch im IE?! | dkabilka | CSS | 3 | 16.03.2010 10:59 |
Form und Target | xm22 | (X)HTML | 1 | 20.03.2007 14:48 |
Barriernfreiheit Target | michael-r | CSS | 13 | 08.02.2007 16:06 |