[falkh]

Hallo,

ich habe das Problem, dass ich das nicht ganz kappiere wie man die verschachtelung genau macht bzw. wie man das aus dem HTML dann ableiten kann.
Ausganssituation ist ich habe ein HTML und möchte hierzu dass CSS schreiben, eigentlich überschreiben aber das nur nebenbei, nur weiss ich nicht wie ich genau da rann komm weil mich die Mehrfachwerte in den CLASS Attributen verwirren.
hier ein Ausschnitt

<div id="zz22_V4QuickLaunchMenu" class="s4-ql">
  <div class="menu vertical menu-vertical">
    <ul class="root static">
      <li class="static">
      <li class="static selected">
        <a class="static selected menu-item" href="/zentral/mar/SitePages/Home.aspx" title="Marketing">
          <ul class="static">
            <li class="static">
              <a class="static menu-item" href="/zentral/mar/Dokumente">
                <span class="additional-background">
                  <span class="menu-item-text">Dokumente</span>

vor dem ersten div kommt normal noch ganz viel aber ich denke das ist erstmal egal
ich möchte nun bei dem <a> Tag links einrücken und eine hintergrundfarbe setzen
wie schreib ich das jetzt in css dass ich genau an dieses <a> ran komme
da hab ich verschiede Herangehensweisen gesehen.
Vielleicht könnte mich mal jemand aufklären auch wie das mit mehreren Werten (z.B. class="static selected menu-item") in den class Attributen zu handhaben ist.
gesehen hab ich jetzt schon Sachen wie (nicht festnagel das mach ich jetzt noch aus meiner Erinnerung)

.s4-ql .root a {
}

.s4-ql ul.root ul > li {
}

div.s4-ql li.static.selected a.menu-item {
}

/*Das geht aber das hab ich aus dem Firebug einfach kopiert und 
     ich weiss nicht warum das so ist wie es ist*/
div.s4-ql div.menu ul.root li.static ul.static li.static a.static {
}

ich versteh nur das ganze nicht ganz. Man kann das irgendwie mixen aber ich hab das Prinzip nicht ganz verstanden und warum sich die class Attribtue manchmal wiederholen.

hoffe da kann mich mal jemand erleuchten

Gruß Falk

[protonenbeschleuniger]

Deine Frage habe ich nicht verstanden, aber dein HTML Code ist nicht valide. Lass dir die Fehler mal anzeigen: The W3C Markup Validation Service

[falkh]

Hallo
das ist ja nur ein Ausschnitt aus dem HTML Code (kann ich nicht beeinflussen, das ist aus SharePoint)

ich möchte im Grunde nur wissen
- wie ich genau deine einen <a> TAG in CSS beeinflussen kann
- was das bedeutet wenn in dem class Attribut mehrere Werte stehen (z.B. class="static selected menu-item")
- wie die Syntax in CSS ist weil manchmal wird mit PUNKt getrennt manchmal mit > oder nur mit LEERZEICHEN (was soll das?)

hoffe es ist jetzt verständlich

[fricca]

Zitat von falkh

- wie ich genau deine einen <a> TAG in CSS beeinflussen kann

Indem du den gewünschten Link mit einem passenden Selektor mit ausreichender Spezifität ansprichst.

- was das bedeutet wenn in dem class Attribut mehrere Werte stehen (z.B. class="static selected menu-item")

Dass das Element mehrere Klassen hat, in diesem Fall drei.

- wie die Syntax in CSS ist weil manchmal wird mit PUNKt getrennt manchmal mit > oder nur mit LEERZEICHEN (was soll das?)

Das sind Selektoren, das ist CSS-Basiswissen. Wenn du irgendetwas mit CSS machen willst musst du lernen, mit Selektoren umzugehen. Ich empfehle dir die Lektüre von Little Boxes.

[protonenbeschleuniger]

Zitat von falkh

das ist ja nur ein Ausschnitt aus dem HTML Code (kann ich nicht beeinflussen, das ist aus SharePoint)

Eiegntlich schwer vorstellbar, dass so eine Software so einen kaputten HTML Code erzeugt.

Wobei aber die Produktseite, aktuell auch über 100 Fehler enthält [Invalid] Markup Validation of http://sharepoint.microsoft.com/de-de/Seiten/default.aspx - W3C Markup Validator

[falkh]

Indem du den gewünschten Link mit einem passenden Selektor mit ausreichender Spezifität ansprichst.

ja und genau da komm ich ja nicht weiter, weil ich nicht verstehe wie man das mach wenn ein Class Attribut mehrere Werte hat, bzw. wie man die verschachtelung im CSS nachbildet wenn ich so was im HTML hab wie in meinem Bsp.

Dass das Element mehrere Klassen hat, in diesem Fall drei.

d.h. das ist im prinzip so als ob ich class="wert1" class="wert2" class="wert3" mach wenn das gehen würde?
und im css sind es dann 3 verschienede werte? also
.wert1 {}
.wert2 {}
.wert3 {}

[isellsoap]

Zitat von falkh

d.h. das ist im prinzip so als ob ich class="wert1" class="wert2" class="wert3" mach wenn das gehen würde?
und im css sind es dann 3 verschienede werte? also
.wert1 {}
.wert2 {}
.wert3 {}

Genau.

[fricca]

Zitat von falkh

ja und genau da komm ich ja nicht weiter, weil ich nicht verstehe wie man das mach wenn ein Class Attribut mehrere Werte hat, bzw. wie man die verschachtelung im CSS nachbildet wenn ich so was im HTML hab wie in meinem Bsp.

Ob eine oder mehrere Klassen im HTML stehen beeinflusst den Umgang mit CSS eigentlich nicht.
Zur Vergabe von mehreren Klassen pro Element kannst du im bereits empfohlenen Little Boxes übrigens ebenfalls nachlesen.

d.h. das ist im prinzip so als ob ich class="wert1" class="wert2" class="wert3" mach wenn das gehen würde?

Theoretisch. Wenn es gehen würde.

und im css sind es dann 3 verschienede werte? also
.wert1 {}
.wert2 {}
.wert3 {}

Muss nicht sein. Klassenselektoren können auch kombiniert werden. Und nicht jede im HTML vergeben Klasse muss im CSS auftauchen.
Ich weiß nicht, was dein Problem ist.

Wenn du ein konkretes Formatierungsproblem hast: Poste einen Link zum Problem, beschreib dein Problem und wie du versucht hast, es zu lösen. Codeschnipsel bringen nichts.

[falkh]

ich kann keinen link posten weildie seite nicht im netz ist
und ein "formatierungs" Problem habe ich auch nicht, ich wollte nur wissen wie man da ran kommt bzw. tut ja der CSS Code ich wollte ihn halt nur genauer erläutert haben weil ich den aus dem Firebug einfach rauskopiert habe

div.s4-ql div.menu ul.root li.static ul.static li.static a.static {}

und ich wollte halt wissen was es mit den mehreren werten pro Class auf sich hat was ich ja nun weiß und wie man die Verschaltelung aus dem HTML Code in CSS nachbildet damit man genau die ein Struktur abbildet.
z.B. wenn ich ja in CSS ein
div a {...} mach dann wird ja nur das a formatiert wenn es nach einem div kommt und so wollte ich halt die ganze struktur abbilden wie in dem CSS Beispiel von oben, nur war jetzt noch die Frage ob ich das .static jedes mal machen muss bzw ob nicht auch folgendes machen kann
.s4-ql .menu .root .static .static .static .static {}

hier hab ich einfach die HTML Tags weg gelassen

[protonenbeschleuniger]

Müssen musst du in dem Fall gar nichts. Das eine sind halt Klassen, die für jedes Element gelten, das andere nur für die entsprechenden HTML Elemente. Es ist aber nicht unbedingt üblich solche Monster Selektoren zu verwenden.