<li> einzeln sylen | CSS

[mfwenzel]

Huhu, hab mal wieder ne kleine Frage:

ich hab eine Navi, in der die einzelnen <li>'s die Klasse "submenu" haben.

Nun würde ich gerne den einzelnen <li>'s ( 8 Stück an der Zahl) jedem einen eigenen Hintergrund geben. Wie mache ich das am Besten?

Edit:

Ich habe also versucht, um die Klasse "submenu" eine neue Klasse "Link1" zu setzen. Wenn ich dort eine bg Farbe einstelle, wird mir diese auch im Dreamweaver angezeigt, aber leider nicht im "VorschauModus"

 

[lonelyhawk]

AW: <li> einzeln sylen | CSS

weis leider nicht was du damit meinst:

um die Klasse "submenu" eine neue Klasse "Link1" zu setzen

aber im allgemeinen fallen mir da erstmal folgende vorschläge ein.

zwei classen für das li-tag, also:

<li class="submenu link1"></li>
<li class="submenu link2"></li>
<li class="submenu link3"></li>
<li class="submenu link4"></li>
[...]

oder du nutzt nur jeweils eine classe also:

<li class="submenu_link1"></li>
<li class="submenu_link2"></li>
<li class="submenu_link3"></li>
<li class="submenu_link4"></li>
[...]

um dann alle gemeinsamen eigenschaften (der jetzigen klasse submenu) dann in der css-datei nicht für jeden link einzeln angeben zu müssen, kannst du sie gemeinsam definieren, also:

.submenu_link1,.submenu_link2,.submenu_link3,.submenu_link4 {
gemeinsame eigenschaften
}
.submenu_link1 {
individuelles hintergrundbild
}
.submenu_link2 {
individuelles hintergrundbild
}
.submenu_link3 {
individuelles hintergrundbild
}
.submenu_link4 {
individuelles hintergrundbild
}

hoffe es hilft dir weiter...

 

[mfwenzel]

AW: <li> einzeln sylen | CSS

Japp, wunderbar, so mache ich es.

[COLOR=#000080]<li class=[COLOR=#0000FF]"submenu_link1"[/COLOR]>[/COLOR][COLOR=#000080]</li>[/COLOR]
[COLOR=#000080]<li class=[COLOR=#0000FF]"submenu_link2"[/COLOR]>[/COLOR][COLOR=#000080]</li>[/COLOR]
[COLOR=#000080]<li class=[COLOR=#0000FF]"submenu_link3"[/COLOR]>[/COLOR][COLOR=#000080]</li>[/COLOR]
[COLOR=#000080]<li class=[COLOR=#0000FF]"submenu_link4"[/COLOR]>[/COLOR][COLOR=#000080]</li>[/COLOR]
[...]

 

[Designerist]

AW: <li> einzeln sylen | CSS

Hallo
Der 2. Vorschlag von Lonelyhawk ist gut, der erste funzt nicht - man kann einem Tag nur eine Klasse zuweisen.
Grüsse, Designerist

 

[dy_raffy]

AW: <li> einzeln sylen | CSS

<li id="submenu1></li>
<li id="submenu2></li>
...
würde auch gehen. mit class ist es allerdings besser. kannst du so oft benutzen wie du möchtest, id nur einmal.

 

[mfwenzel]

AW: <li> einzeln sylen | CSS

Hallo
Der 2. Vorschlag von Lonelyhawk ist gut, der erste funzt nicht - man kann einem Tag nur eine Klasse zuweisen.
Grüsse, Designerist

Japp, deswegen hab ich den 2. genommen

Bei mir siehts jetzt so aus:

<li class="submenu">
                <ul>
                    <li class="submenu_link1">Haus 106</li>
                    <li class="submenu_link2">Haus 111</li>
                    <li class="submenu_link3">Haus 112</li>
                    <li class="submenu_link4">Haus 116</li>
                    <li class="submenu_link5">Haus 124</li>
                    <li class="submenu_link6">Haus 124a</li>
                    <li class="submenu_link7">Haus 130</li>
                    <li class="submenu_link8">Haus 131</li>
                </ul>
</li>

 

[MyBad]

AW: <li> einzeln sylen | CSS

Man kann einem Tag auch zwei Klassen zuweisen, indem man diese durch ein Leerzeichen trennt!

Zum Beispiel: <li class="submenue link1">Text</li>

Gruß
Tim

 

[leohh]

AW: <li> einzeln sylen | CSS

class = cdata-list [CS]
This attribute assigns a class name or set of class names to an element. Any number of elements may be assigned the same class name or names. Multiple class names must be separated by white space characters.

7.5.2 Element identifiers: the id and class attributes

Abgeaendert, da alles erklaert

 

[lonelyhawk]

AW: <li> einzeln sylen | CSS

Man kann einem Tag auch zwei Klassen zuweisen, indem man diese durch ein Leerzeichen trennt!

Zum Beispiel: <li class="submenue link1">Text</li>

Gruß
Tim

danke für die verbesserung, hast natürlich recht, war bisschen zu viel copy&paste... werde es oben mal abändern.