verschiedene Aufzälhlungseigenschaften
tet
- css
0 tet0 David Tibbe0 wahsaga
hallo leute,
folgendes würde ich gerne wissen ob es geht und wenn ja, wie es geht:
ich habe verschiedene aufzählung deren eigenschaften ich über css steuern möchte.
Aufzählung 1:
<ul id="nav">
<li> Language
<ul>
<li><a class="language" href="">Deutsch</a></li>
<li><a class="language" href="">English</a></li>
<li><a class="language" href="">Francais</a></li>
</ul>
</li>
</ul>
Aufzählung 2:
<ul id="nav">
<li> Status
<ul>
<li><a class="language" href="">Rot</a></li>
<li><a class="language" href="">Blau</a></li>
<li><a class="language" href="">Gelb</a></li>
</ul>
</li>
</ul>
wie kann ich in css den beiden aufzählungen verschiedene eigenschaften vergeben??
danke für eure hilfe
tet
ergänzung:
mit eigenschaften meine ich z.b. verschieden schriftfarben oder farbhintergründe.
tet
Hallo tet,
ich habe verschiedene aufzählung deren eigenschaften ich über css steuern möchte.
Die sind aber nicht in der gleichen Datei, oder? Sonst wäre es nämlich falsch da eine ID eindeutig sein muss.
Du kannst den Menüs einfach unterschiedliche IDs verpassen oder eine zusätzliche Klasse.
Grüße
David
hi,
<li> Language
pfui :-) du willst hier vermutlich padding verwenden.
wie kann ich in css den beiden aufzählungen verschiedene eigenschaften vergeben??
in dem du dich mit selektoren in CSS beschäftigst.
per ID wäre vermutlich am passendsten, wenn jedes element pro dokument nur ein mal vorkommt: http://de.selfhtml.org/css/formate/zentrale.htm#individualformate
ansonsten auch per klasse, o.ä.
gruß,
wahsaga
ich habe folgende liste:
ul { /* all lists */
padding: 0;
margin: 0;
list-style: none;
}
li { /* all list items */
float: left;
position: relative;
width: 10em;
font-family: Arial, Helvetica, sans-serif;
font-size: 10px;
font-style: normal;
font-weight: normal;
color: #2C5D60;
background-color : #D4DEDE;
line-height: 20px;
text-align: left;
}
li ul { /* second-level lists */
display: none;
position: absolute;
top: 20px;
left: 0;
}
li>ul { /* to override top and left in browsers other than IE, which will position to the top right of the containing li, rather than bottom left */
top: auto;
left: auto;
}
li:hover ul, li.over ul { /* lists nested under hovered list items */
display: block;
background-color : black;
border-bottom: 1px solid #ffffff;
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
font-style: normal;
font-weight: bold;
color: #ffffff;
text-align: left;
}
A.language:visited{ /* lists nested under hovered list items */
display: block;
background-color : 709090;
padding-left: 7px;
border-bottom: 1px solid #ffffff;
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
font-style: normal;
font-weight: bold;
color: #ffffff;
text-align: left;
}
A.language:link{ /* lists nested under hovered list items */
display: block;
background-color : #709090;
padding-left: 7px;
border-bottom: 1px solid #ffffff;
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
font-style: normal;
font-weight: bold;
color: #ffffff;
text-align: left;
}
A.language:active{ /* lists nested under hovered list items */
display: block;
background-color : #CCCCCC;
padding-left: 7px;
border-bottom: 1px solid #ffffff;
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
font-style: normal;
font-weight: bold;
color: #ffffff;
text-align: left;
}
A.language:hover, A.language{
display: block;
background-color : #2C5D60;
padding-left: 7px;
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
font-style: normal;
font-weight: bold;
color: #ffffff;
border-bottom: 1px solid #ffffff;
text-align: left;
}
so, nun möchte ich aber der ersten aufzählung andere eigenschaften zukommen lassen wie der zweiten. wie kann ich hierbei bei den listen unterscheiden?
bei den links habe ich keine schwierigkeiten. bei der aufzählung schon eher. und alles befindet sich leider in einer datei.
tet
hi,
ich habe folgende liste:
schön - aber warum erzählst du mir das?
CSS-dateien habe ich selber, und zwar zur genüge. und wenn sie mir irgendwann mal ausgehen sollten, schreibe ich mir neue :-)
so, nun möchte ich aber der ersten aufzählung andere eigenschaften zukommen lassen wie der zweiten. wie kann ich hierbei bei den listen unterscheiden?
dass selektoren das stichwort sind, mit dem du dich beschäftigen sollst, sagte ich dir bereits - also tue es bitte auch.
falls dir dieses thema in selfhtml nicht ausführlich genug behandelt wird - bitte, hier gibt's mehr dazu: http://www.w3.org/TR/CSS21/selector.html
und David gab dir auch einen hinweis, dem du unbedingt beachtung schenken solltest.
gruß,
wahsaga