Farbe "normalisieren"

[heinetz]

Hallo Forum,

die Begrifflichkeit "Normalisieren" ist in dem Zusammenhang
sicher nicht ganz korrekt.

Folgender Fall:

In meinem Menü (verschachtelte Liste) haben die Menüpunkte
der ersten Ebnene eine Farbe per CSS zugewiesen bekommen.

ul li{
color: green;
}

die darunterliegenden Listenelemete  der zweiten Ebene sollen
in der Standardfarbe dargestellt werden:

body{
color: black;
}

... sind aber durch Vererbung erstmal grün ;(

Ich kann zwar mit:

ul li *{
color: black;
}

... dafür sorgen , dass die wieder schwarz sind. Allerdings
finde ich die Methode unelegant, weil ich damit die
Standardfarbe an zwei Stellen pflegen muss:

Gibt es einen Weg, wenn ich weiterhin auf class verzichten
will ?

danke und beste gruesse,
heinetz

[Beat]

Gibt es einen Weg, wenn ich weiterhin auf class verzichten
will ?

Die Vererbung von color hat nichts mit den Selektoren zu tun.

Ich tippe auf blödsinniges markup.
Deine mehrstufige Navigation hat ja wohl in den <li> Elementen
-- Labels
-- Links
-- oder Listen
welchen du die Farbe zuweist.

mfg Beat

[heinetz]

Die Vererbung von color hat nichts mit den Selektoren zu tun.

Ich tippe auf blödsinniges markup.
Deine mehrstufige Navigation hat ja wohl in den <li> Elementen
-- Labels
-- Links
-- oder Listen
welchen du die Farbe zuweist.

sorry, irgendwie srechen wir wohl unterschiedliche Sprachen.

vielen dank,
heinetz

[Beat]

Die Vererbung von color hat nichts mit den Selektoren zu tun.

Ich tippe auf blödsinniges markup.
Deine mehrstufige Navigation hat ja wohl in den <li> Elementen
-- Labels
-- Links
-- oder Listen
welchen du die Farbe zuweist.

sorry, irgendwie srechen wir wohl unterschiedliche Sprachen.

Mag sein.
HTML ist das Material für CSS Anweisungen.
Vernünftiges Markup vorausgesetzt, musst du dem li Element gar keine Farbe zuweisen, und es gibt nichts zu "normalisieren". Statt dessen weist du Farbe und Hintergrund den labels und Links zu.
OK?

Andernfalls: "Normalisieren" von vererbbaren Eigenschaften bläht das CSS in den Massen auf, in welchen man HTML zu sparen wünschte.

mfg Beat

[Malcolm Beck´s]

hi,

Vernünftiges Markup vorausgesetzt, musst du dem li Element gar keine Farbe zuweisen, und es gibt nichts zu "normalisieren". Statt dessen weist du Farbe und Hintergrund den labels und Links zu.

Und das ist zwingend so?

Was ist denn mit Listen ohne labels (was haben eigentlich labels damit zu tun?) und Links?

<ul>  
<li>Text</li>  
<li>Text1  
  <ul>  
   <li>blah</li>  
   <li>blubb</li>  
  </ul>  
 </li>  
<li>Text2</li>  
</ul>

Soll man dann hier den DOM-Baum unnötigerweise aufblähen, damit man diese stylen kann?

Andernfalls: "Normalisieren" von vererbbaren Eigenschaften bläht das CSS in den Massen auf, in welchen man HTML zu sparen wünschte.

Wenn du mit so einer Trivialen Geschichte dein CSS der maßen aufblähst, dass es tatsächlich ins Gewicht fällt, machst du was falsch.
Zumal man bei CSS den Vortel des Browsercaches auf seiner Seite hat.

mfg

[Beat]

Vernünftiges Markup vorausgesetzt, musst du dem li Element gar keine Farbe zuweisen, und es gibt nichts zu "normalisieren". Statt dessen weist du Farbe und Hintergrund den labels und Links zu.

Und das ist zwingend so?

Wir haben es nicht mit einer neutralen Liste zu tun, sondern mit einem Menu.

Was ist denn mit Listen ohne labels (was haben eigentlich labels damit zu tun?) und Links?

Labels sind in Menus zu erwarten.
Menus führen ultimativ zu Links oder Labels.

Bei neutralen hierarchischen Listen bist du mit Klassen besser bedient.

Oder nimm den Fall von customized Bullets.
Hier wirst du entweder Klassen setzen müssen, oder halt für jede verschachtelungstiefe den Bullet bestimmen müssen. Aber das ist ein anderes Thema als das renormlisieren zu einem Default für li

<ul>

<li>Text</li>
<li>Text1
  <ul>
   <li>blah</li>
   <li>blubb</li>
  </ul>
</li>
<li>Text2</li>
</ul>

  

> Soll man dann hier den DOM-Baum unnötigerweise aufblähen, damit man diese stylen kann?  
  
Ist es unnötig, dem Dom Semantik zu verleihen, wo möglich?  
  
Für einfache Listen genügt mir eine Klasse bei der äussersten Liste.  
Sobald meine Liste aber komplexer wird, werde ich mehr Klassen brauchen, oder Vorteil dadurch geniessen, dass Der Inhalt der Li Elemente selbst semantisch ausgezeichnet werden kann.  
  
Aber nochmals: Das Thema war ein Menu, nicht eine neutrale Liste.  
  
mfg Beat

-- 

><o(((°>           ><o(((°>  

   <°)))o><                     ><o(((°>o  
Der Valigator leibt diese Fische

[Malcolm Beck´s]

hi,

Wir haben es nicht mit einer neutralen Liste zu tun, sondern mit einem Menu.

https://forum.selfhtml.org/?t=189621&m=1263295

ul li {  
  color:green;  
}

Wird ausser Text nichts in Grün darstellen, vor allem keine Links, die ich für ein Menu jetzt mal voraussetze.

Labels sind in Menus zu erwarten.
Menus führen ultimativ zu Links oder Labels.

Ok, dann mal anders gefragt: was sollen Labels in diesem Zusammenhang sein und wie sieht sowas aus?

Bei neutralen hierarchischen Listen bist du mit Klassen besser bedient.

Das war ja nicht die frage, wir wissen auch nicht, ob es eine Designlastige Seite ist, oder nicht.

ul li {  
  color:green;  
}

Lässt jedenfalls darauf schliessen, dass es um Generelle definitionen geht, die später noch überschrieben werden „könnten“.

Ist es unnötig, dem Dom Semantik zu verleihen, wo möglich?

Kommt doch ganz drauf an -- bei einer Dokumentation, wo kaum Design vorzufinden ist, nicht.
Und man muss ja auch nicht wirklich für jede kleinigkeit den DOM aufblähen, solange man mit CSS vernünftig arbeitet.

Ich will dir nicht widersprechen, ich arbeite auch viel mit Klassen, IDs und Inline-Elementen, nur ist und sollte das kein muss und vor allem keine vorraussetzung sein, um mit CSS arbeiten zu können.

Für einfache Listen genügt mir eine Klasse bei der äussersten Liste.

Viele wege führen nach Rom.
Wenn ich eine Liste in einem bestimmten div habe (warum auch immer), genügt mir auch das div, oder dessen ID/Klasse, um die liste zu stylen, sogar ohne ul anzusprechen.

Sobald meine Liste aber komplexer wird, werde ich mehr Klassen brauchen, oder Vorteil dadurch geniessen, dass Der Inhalt der Li Elemente selbst semantisch ausgezeichnet werden kann.

Wie gesagt, die Ausgangsfrage lässt nicht darauf schliessen, dass es hier um eine Komplexe Liste geht.

mfg

[flowh]

Hallo heinetz.

Menü (verschachtelte Liste)

Zeig bitte dein HTML, dann kann man eine genauere Aussage treffen.

Servus,
Flo

[ChrisB]

Hi,

... dafür sorgen , dass die wieder schwarz sind. Allerdings
finde ich die Methode unelegant, weil ich damit die
Standardfarbe an zwei Stellen pflegen muss

Pflege sie doch einfach an einer Stelle, wo du zwei oder ggf. auch mehr Selektoren notierst.

MfG ChrisB

[Malcolm Beck´s]

hi,

ul li{
color: green;
}

die darunterliegenden Listenelemete  der zweiten Ebene sollen
in der Standardfarbe dargestellt werden:

body{
color: black;
}

... sind aber durch Vererbung erstmal grün ;(

Wie wäre es denn mit:

ul {  
 color: green;  
}  
ul ul {  
 color: black;  
}

Ich kann zwar mit:

ul li *{
color: black;
}

Nein, diese variante solltest du nicht verwenden: Use efficient CSS selectors

mfg

[heinetz]

Hallo Forum,

danke für die Diskussion!

meine Frage ist eigentlich beantwortet:

die für den Selektor 'ul' definierte Eigenschaft {color:green;} vererbt sich ungewollt auf 'ul li ul'. Dem selktor 'ul li ul' kann man wahrscheinlich (theoretisch) die Eigenschaf {color:none;} zuweisen. was ich aber wollte, war dem die Eigenschaft 'color' des darüberliegenden Elements body zuzuweisen und das geht nicht.

Ich tippe auf blödsinniges markup.
Deine mehrstufige Navigation hat ja wohl in den <li> Elementen
-- Labels
-- Links
-- oder Listen
welchen du die Farbe zuweist.

... was sicher die sinnvollste Lösung in meinem Fall ist, jedoch als Antwort auf die Frage eines Hilfesuchenden nicht taugt, weil es als vollkommen unqualifizierte Besserwisserei formuliert vollkommen fehl am Patz ist. Ich tippe auf mangelhaftes Sozialverhalten ;)

schoene gruesse,
heinetz

[Malcolm Beck´s]

hi,

Ich tippe auf blödsinniges markup.
Deine mehrstufige Navigation hat ja wohl in den <li> Elementen
-- Labels
-- Links
-- oder Listen
welchen du die Farbe zuweist.

... was sicher die sinnvollste Lösung in meinem Fall ist, jedoch als Antwort auf die Frage eines Hilfesuchenden nicht taugt

Zeig doch mal einen Ausschnitt aus deinem HTML -- mit den Infos, die du in deinem Ausgangsposting geschrieben hast, fällt es mir schwer, dir Tipps zu geben[1].

ul li {  
  color:green;  
}

Das lässt jedenfalls nicht darauf schliessen, dass du hier den Links im Menu eine Farbe zuweist, denn diese werden diese Farbe nicht übernehmen, sondern in Blau oder Pink (Visited) sein.

mfg
[1] und da spreche ich Sicher nicht nur für mich allein

[ChrisB]

Hi,

die für den Selektor 'ul' definierte Eigenschaft {color:green;} vererbt sich ungewollt auf 'ul li ul'.

Nein, gewollt.

Dem selktor 'ul li ul' kann man wahrscheinlich (theoretisch) die Eigenschaf {color:none;} zuweisen.

Nein, kann man nicht - weil das kein gültiger Wert für color ist.

was ich aber wollte, war dem die Eigenschaft 'color' des darüberliegenden Elements body zuzuweisen und das geht nicht.

Nein, in der Tat nicht.

... was sicher die sinnvollste Lösung in meinem Fall ist, jedoch als Antwort auf die Frage eines Hilfesuchenden nicht taugt, weil es als vollkommen unqualifizierte Besserwisserei formuliert vollkommen fehl am Patz ist. Ich tippe auf mangelhaftes Sozialverhalten ;)

Ich tippe auf meine Antwort nicht verstanden; aber vielleicht wenigstens Detlefs nochmaliges Aufgreifen meines Vorschlages ...?
Das ist nämlich für das, was du erreichen willst, IMHO die "sinnvollste" Antwort.

MfG ChrisB

[Detlef G.]

Hallo heinetz

Gibt es einen Weg, wenn ich weiterhin auf class verzichten
will ?

Ja, wenn auch vielleicht nicht ganz so, wie du es dir vorstellst.
Was ChrisB dir sagen wollte, du kannst Eigenschften, die für verschiedene Elemente immer identisch sein sollen an einer einzigen Stelle im Stylesheet pflegen.
Beispiel:

body,  
ul li * {  
  color: black;  
}  

Auf Wiederlesen
Detlef