mattihas: Überschreiben von color-Anweisungen per css

Hallo,

ich habe folgende Frage:

In einer Tabelle gehören mehrere aufeinanderfolgende Zeilen inhaltlich zusammen.
Markiert der Anwender eine der Zeilen mit der Maus, so sollen alle
zusammengehörenden Zeilen hervorgehoben werden.

Meine Idee war, dass ich die jeweils zusammengehörenden Zeilen in ein
<tbody>-Tag packe und per css (tbody:hover) dann Vorder- und Hintergrund einfärbe.
Dies funktioniert, solange im html-Code keine Farben definiert werden.
Da ich die Verwendung von Farben im html-Code aber nicht beinflussen kann,
suche ich eine Möglichkeit, wie ich die im html-code vorkommenden Farben
per css überschreiben kann - egal, ob diese als Attribut eines <TR> oder eines <FONT>-Tags oder sonstwo angegeben wurden.

Geht das? Wie?

Vielen Dank für alle Ideen.

Hier nun der Beispielcode:

Bewegt man die Maus auf eine der Zeilen, wird die Schriftfarbe
des gesamten <tbody> auf rot geändert. Allerdings nicht
die Hintergrundfarbe, da <TR BGCOLOR=...> eine höher Priorität hat.

  
<html><head>  
<style type="text/css">  
  
tbody:hover { background-color:green !important; color:red}  
</style>  
  
</head><body>  
<table border="1"> <tbody>  
<TR BGCOLOR="yellow"><TD>column1-1</TD></TR>  
<TR BGCOLOR="yellow"><TD>column1-2</TD></TR>  
</tbody>  
<tbody>  
<TR BGCOLOR="blue"><TD>column2-1</TD></TR>  
<TR BGCOLOR="blue"><TD>column2-2</TD></TR>  
</tbody>  
</table>  
</body></html>  

  1. Hi,

    In einer Tabelle gehören mehrere aufeinanderfolgende Zeilen inhaltlich zusammen.
    Markiert der Anwender eine der Zeilen mit der Maus, so sollen alle
    zusammengehörenden Zeilen hervorgehoben werden.

    Wie - dynamisch, clientseitig, per JavaScript?

    Meine Idee war, dass ich die jeweils zusammengehörenden Zeilen in ein
    <tbody>-Tag packe und per css (tbody:hover) dann Vorder- und Hintergrund einfärbe.

    Wenn das nur eine temporäre Auswahl sein soll, erscheint es mir weniger sinnvoll, auf Grund dieser derart tief in die Struktur einzugreifen.
    Das Vergeben bspw. einer Klasse wäre dann günstiger.

    Dies funktioniert, solange im html-Code keine Farben definiert werden.
    Da ich die Verwendung von Farben im html-Code aber nicht beinflussen kann

    Wieso kannst du nicht?
    Wenn du die „Macht“ hast, die Zeilen in TBODY-Elemente zu setzen, dann hast du doch wohl Zugriff auf HTML oder DOM.

    MfG ChrisB

    --
    RGB is totally confusing - I mean, at least #C0FFEE should be brown, right?
    1. Meine Idee war, dass ich die jeweils zusammengehörenden Zeilen in ein
      <tbody>-Tag packe und per css (tbody:hover) dann Vorder- und Hintergrund einfärbe.

      Wenn das nur eine temporäre Auswahl sein soll, erscheint es mir weniger sinnvoll, auf Grund dieser derart tief in die Struktur einzugreifen.
      Das Vergeben bspw. einer Klasse wäre dann günstiger.

      Du meinst je zusammenhängendem Bereich eine Klasse definieren und diese dann den jeweiligen <TR> zuweisen?
      Dann bräuchte ich aber doch für jede Klasse eine css-Definition für 'hover'?
      Da die Tabelle u.U einige Tausend Datenblöcke (zusammengehörende <TR>) enthalten kann würde das zwar gehen - aber ob das gut wäre?

      Dies funktioniert, solange im html-Code keine Farben definiert werden.
      Da ich die Verwendung von Farben im html-Code aber nicht beinflussen kann

      Wieso kannst du nicht?
      Wenn du die „Macht“ hast, die Zeilen in TBODY-Elemente zu setzen, dann hast du doch wohl Zugriff auf HTML oder DOM.

      Die Daten welche in die <TR> eingebaut werden kommen aus einem vom Anwender parametrierbaren System. Und wenn da jemand <TR BGCOLOR=...> hinterlegt (oder  auch <FONT COLOR=...> kann (und will) ich das nicht verhindern, da die Anzeige ja so sein soll, wie es der Anwender parametriert hat.
      Jedoch will/muss ich den Datenblock als solchen markieren, wenn er ausgewählt wird.

      matthias

      1. Om nah hoo pez nyeetz, matthias!

        Da die Tabelle u.U einige Tausend Datenblöcke (zusammengehörende <TR>) enthalten kann würde das zwar gehen - aber ob das gut wäre?

        Wenn du die „Macht“ hast, die Zeilen in TBODY-Elemente zu setzen, ...

        Matthias

        --
        Wer ein Problem beschreiben kann, hat es schon halb gelöst.                                             (Julian Huxley) http://www.billiger-im-urlaub.de/kreis_sw.gif
  2. Hallo,

    Allerdings nicht

    die Hintergrundfarbe, da <TR BGCOLOR=...> eine höher Priorität hat.

    Versuchs mal so

    [code lang=html]
    <html><head>
    <style type="text/css">

    tbody tr:hover { background-color:green !important; color:red}
    </style>

    1. Hallo,

      kleine korrektur, hatte es falsch gelesen:

      tbody:hover tr {background-color:green;}

      1. Hallo,
        kleine korrektur, hatte es falsch gelesen:

        tbody:hover tr {background-color:green;}

        Danke! Das hilft mir weiter.

  3. @@mattihas:

    nuqneH

    Bewegt man die Maus auf eine der Zeilen, wird die Schriftfarbe
    des gesamten <tbody> auf rot geändert. Allerdings nicht
    die Hintergrundfarbe, da <TR BGCOLOR=...> eine höher Priorität hat.

    Nein, nicht deshalb. Du änderst die Hintergrungdfarbe von tbody, was nicht zu sehen ist, da diese vollständig von der Hintergrungdfarbe von tr überdeckt wird. [CSS21 §17.5.1]

    Du musst schon die Hintergrungdfarbe von tr ändern …

    suche ich eine Möglichkeit, wie ich die im html-code vorkommenden Farben
    per css überschreiben kann - egal, ob diese als Attribut eines <TR> oder eines <FONT>-Tags oder sonstwo angegeben wurden.

    … oder gleich die aller Nachfahrenelemente des jeweilig gehoverten tbody:

    tbody:hover * { background-color:green; color:red}

    '!important' ist nicht erforderlich.

    Qapla'

    --
    Gut sein ist edel. Andere lehren, gut zu sein, ist noch edler. Und einfacher.
    (Mark Twain)
    1. Om nah hoo pez nyeetz, Gunnar Bittersmann!

      Nein, nicht deshalb. Du änderst die Hintergrungdfarbe von tbody, was nicht zu sehen ist, da diese vollständig von der Hintergrungdfarbe von tr überdeckt wird. [CSS21 §17.5.1]

      in bunt im wiki*

      • Ich weiß, du magst keine Sekundärliteratur.

      Matthias

      --
      Wer ein Problem beschreiben kann, hat es schon halb gelöst.                                             (Julian Huxley) http://www.billiger-im-urlaub.de/kreis_sw.gif
      1. Hi,

        * Ich weiß, du magst keine Sekundärliteratur.

        Wie kommst Du darauf? Er verlinkt doch ständig Sekundärliteratur (z.B. verlinkt er immer auf die deutsche Übersetzung statt auf die HTML-Spezifikation).

        cu,
        Andreas

        --
        Warum nennt sich Andreas hier MudGuard?
        O o ostern ...
        Fachfragen per Mail sind frech, werden ignoriert. Das Forum existiert.