Alexander Knöller: 3 HTML-Elemente gehören einem Individualformat (id="") an

Hallo!

Ich möchte drei Tabellen, die jeweils drei verschiedenen CSS-Klassen angehören, dieselbe Hintergrundfarbe geben.

Dabei soll die Hintergrundfrabe in der CSS-Datei nur einmal vorkommen, so dass ich sie nur an einer Stelle zu ändern brauche und nicht in den 3 in Frage kommenden Klassen.

Mein Versuch:
***************************************
<html>
...

<style type="text/css">
<!--
table.klasse1 {...}
table.klasse2 {...}
table.klasse3 {...}

#farbe {background-color: #ff6600;}
-->
</style>

...
<table class="klasse1" id="farbe">
..
<table class="klasse2" id="farbe">
..
<table class="klasse3" id="farbe">
..
</html>
***************************************

Das Problem damit ist, dass der XHTML-Validator es nicht anerkennt, da eine ID-Bezeichnung mehrmals vorkommt (logisch). Bemerkung: Mein HTML soll XHTML1.0-konform sein. Muss ich jetzt die Hintergrundfarbe doch in jeder CSS-Klasse definieren?

Elegant wäre es, wenn man in CSS Variablen definieren könnte, z.B. eben meine Hintergrundfarbe.

Fällt jemandem von Euch vielleicht eine Lösung dazu ein?

Vielen Dank,

  • Alex
  1. Hallo Alexander!

    table.klasse1 {...}
    table.klasse2 {...}
    table.klasse3 {...}

    #farbe {background-color: #ff6600;}

    Fällt jemandem von Euch vielleicht eine Lösung dazu ein?

    Laß die id weg, und versuchs so:
    table.klasse1,table.klasse2,table.klasse3
      {
      background-color: #ff6600;
      }

    table.klasse1
      {
      /* Angaben für klasse1 */
      }

    usw.

    Das sollte eigentlich problemlos gehen.
    (Lesetip: http://selfhtml.teamone.de/css/formate/zentrale.htm#elemente, insbesondere die Formatierung von p und li, weil das ja im Prinzip das selbe ist, wie bei deinem Problem.)

    MfG
    Götz

    --
    Losung und Lehrtext für Mittwoch, 1. Oktober 2003
    Der Herr sprach: Ich will hinfort nicht mehr die Erde verfluchen um der Menschen willen; denn das Dichten und Trachten des menschlichen Herzens ist böse von Jugend auf. (1.Mose 8,21)
    Es gibt keine Verdammnis für die, die in Christus Jesus sind. (Römer 8,1)
    (http://www.losungen.de/heute.php3)
    1. Hallo Götz,

      Laß die id weg, und versuchs so:
      table.klasse1,table.klasse2,table.klasse3

      Tschuldige bitte, ich hätte Dein Posting sorgfältiger lesen sollen, ehe ich
      redundant geantwortet habe. :-)

      Tim

  2. Alex

    Wie Du richtig bemerkt hast, darfst Du nicht die selbe id für mehrere Elemente verweden. Daher ist die vorgeschlagene Lösung ok. Was Du auch machen kannst ist die Farbe auf die Tabelle anwenden class="farbe_tabelle" und die restlichen CSS Definitionen im td machen (oder sogar auf den Inhalt bezogen der in der td ist).

    Probiers, Andre

    --

    Dschinni - Web in alle Richtungen
    http://www.dschinni.ch

  3. Hi,

    Dabei soll die Hintergrundfrabe in der CSS-Datei nur einmal vorkommen, so dass ich sie nur an einer Stelle zu ändern brauche und nicht in den 3 in Frage kommenden Klassen.

    Noch eine Möglichkeit:
    Das class-Attribut kann eine whitespacegetrennte Liste von Klassennamen enthalten:

    <table class="klasse1 farbe">
    <table class="klasse2 farbe">
    <table class="klasse2 farbe">

    table.klasse1 {...}
    table.klasse2 {...}
    table.klasse3 {...}
    .farbe {background-color: #ff6600;}

    cu,
    Andreas

    --
    Der Optimist: Das Glas  ist halbvoll.  - Der Pessimist: Das Glas ist halbleer. - Der Ingenieur: Das Glas ist doppelt so groß wie nötig.
    http://mud-guard.de/? http://www.andreas-waechter.de/ http://www.helpers.de/
  4. Vielen Dank fuer die prompte und kompetente Antwort!

    Werde die Vorschlaege gleich ausprobieren.

    Habe das erste Mal hier gepostet und finde es grossartig wie schnell hier einem geholfen wird! Danke!

    • Alex
  5. Hallo Alexander,

    Mein Versuch:

    Ich würde es etwas anders machen:

    <style type="text/css">
    <!--
    table.klasse1 {...}
    table.klasse2 {...}
    table.klasse3 {...}

    .klasse1, .klasse2, .klasse3 {background-color: #ff6600;}

    -->
    </style>

    Es steht ja nirgendwo, daß man in CSS einer Klasse nur einmal bestimmte
    Eigenschaften zuweisen darf. Dazu »spart« man eine obsolote, nur für die
    Gestaltung zuständige Klasse und sollten sich dann doch irgendwann abweichende
    Farben für die drei Tabellen ergeben, editiert man einfach in der CSS-Datei
    herum, anstatt Klassenbezeichnungen in eventuell x-tausenden HTML-Dateien
    zu entfernen. Ich finde das sauberer.

    Tim

    1. Hallo Tim!

      Redundanz ist das halbe Forum, oder so! ;)

      Es steht ja nirgendwo, daß man in CSS einer Klasse nur einmal bestimmte
      Eigenschaften zuweisen darf. [...]

      Vielen Dank noch für diesen ergänzenden Text, den ich mir, in weiser Vorraussicht zu später Stunde, gespart habe ;)

      MfG
      Götz

      --
      Losung und Lehrtext für Mittwoch, 1. Oktober 2003
      Der Herr sprach: Ich will hinfort nicht mehr die Erde verfluchen um der Menschen willen; denn das Dichten und Trachten des menschlichen Herzens ist böse von Jugend auf. (1.Mose 8,21)
      Es gibt keine Verdammnis für die, die in Christus Jesus sind. (Römer 8,1)
      (http://www.losungen.de/heute.php3)