MediaWiki:Common.css: Unterschied zwischen den Versionen
Zur Navigation springen
Zur Suche springen
imported>Admin |
imported>Admin |
||
Zeile 20: | Zeile 20: | ||
letter-spacing: 0.3px; | letter-spacing: 0.3px; | ||
color: #444; | color: #444; | ||
+ | } | ||
+ | #tab1:checked ~ figure .tab1, | ||
+ | #tab2:checked ~ figure .tab2, | ||
+ | #tab3:checked ~ figure .tab3 { display: block; } | ||
+ | label-Elemente mit dem for-Attribut, das zum jeweiligen input-Tag passt, reagieren zusammen mit den input-Elementen, auch wenn die Radio-Buttons mit display:none nicht eingespielt werden. | ||
+ | |||
+ | nav label { | ||
+ | float: left; | ||
+ | padding: 15px 15px; | ||
+ | border-top: 1px solid silver; | ||
+ | border-right: 1px solid silver; | ||
+ | background: hsl(210,50%,50%); | ||
+ | color: #eee; | ||
+ | } | ||
+ | |||
+ | nav label:nth-child(1) { border-left: 1px solid silver; } | ||
+ | nav label:hover { background: hsl(210,50%,40%); } | ||
+ | nav label:active { background: #ffffff; } | ||
+ | |||
+ | #tab1:checked ~ nav label[for="tab1"], | ||
+ | #tab2:checked ~ nav label[for="tab2"], | ||
+ | #tab3:checked ~ nav label[for="tab3"] { | ||
+ | background: white; | ||
+ | color: #111; | ||
+ | position: relative; | ||
+ | border-bottom: none; | ||
+ | } | ||
+ | |||
+ | #tab1:checked ~ nav label[for="tab1"]:after, | ||
+ | #tab2:checked ~ nav label[for="tab2"]:after, | ||
+ | #tab3:checked ~ nav label[for="tab3"]:after { | ||
+ | content: ""; | ||
+ | display: block; | ||
+ | position: absolute; | ||
+ | height: 2px; | ||
+ | width: 100%; | ||
+ | background: white; | ||
+ | left: 0; | ||
+ | bottom: -1px; | ||
} | } | ||
.statements {border-spacing: 1px;} | .statements {border-spacing: 1px;} |
Version vom 5. August 2020, 11:53 Uhr
/* Das folgende CSS wird für alle Benutzeroberflächen geladen. */ <style> /* Tabs mit radio-Buttons */ .tabbed figure { display: block; margin-left: 0; border-bottom: 1px solid silver; clear: both; } .tabbed > input, .tabbed figure > div { display: none; } .tabbed figure>div { padding: 20px; width: 100%; border: 1px solid silver; background: #fff; line-height: 1.5em; letter-spacing: 0.3px; color: #444; } #tab1:checked ~ figure .tab1, #tab2:checked ~ figure .tab2, #tab3:checked ~ figure .tab3 { display: block; } label-Elemente mit dem for-Attribut, das zum jeweiligen input-Tag passt, reagieren zusammen mit den input-Elementen, auch wenn die Radio-Buttons mit display:none nicht eingespielt werden. nav label { float: left; padding: 15px 15px; border-top: 1px solid silver; border-right: 1px solid silver; background: hsl(210,50%,50%); color: #eee; } nav label:nth-child(1) { border-left: 1px solid silver; } nav label:hover { background: hsl(210,50%,40%); } nav label:active { background: #ffffff; } #tab1:checked ~ nav label[for="tab1"], #tab2:checked ~ nav label[for="tab2"], #tab3:checked ~ nav label[for="tab3"] { background: white; color: #111; position: relative; border-bottom: none; } #tab1:checked ~ nav label[for="tab1"]:after, #tab2:checked ~ nav label[for="tab2"]:after, #tab3:checked ~ nav label[for="tab3"]:after { content: ""; display: block; position: absolute; height: 2px; width: 100%; background: white; left: 0; bottom: -1px; } .statements {border-spacing: 1px;} .statement {border-spacing: 1px;} .property {background-color: Tomato; color: #E6E6E6; font-size: 14px;} .values {background-color: #FEF3DD;} .value {} .qstatements {background-color:#E1CCA4; border-color: grey;} .qstatement {background-color:#E1CCA4;} .qproperty {background-color:#E1CCA4;} .qvalues {background-color:#E1CCA4;} .qvalue {} </style>