nicht angemeldet
Hallo Füchschen,
wie kann ich eine CSS-Angabe für ein Element auf eine CSS-Angabe für ein
anderes Element beziehen, z. B.
Gar nicht. Das Konzept von Variablen bzw. Verweisen gibt es in CSS nicht.
Du könntest aber die Cascadierung von CSS ausnutzen und damit ökonomischer
mit dem Getipptem umgehen:
Ich definiere eine Klasse mit bestimmten Eigenschaften ...
.fliesstext {
font-size:1em;
font-family:Zapfino, serif;
color:black;
/* ... */
}
Und kann diese an verschiedenen Stellen im Dokument einsetzen:
<span class="fliesstext">Blub</span>
<div class="fliesstext">Blub</div>
Man kann auch verschiedene Klassen kombinieren, wenn der Text dann in
verschiedene Klassen fällt:
.vorspann {
color:blue;
}
<div class="fliesstext vorspann">Blub</div>
Oder auch durchaus für bestimmte Elemente bestimmte Eigenschaften einer
Klasse überschreiben:
#maschinentext {
font-family:Monaco, monospace;
}
<div id="maschinentext" class="fliesstext">Blub</div>
Den ökonomischen und sinnvollen Umgang mit CSS lernt man am besten durch
Übung. Zuviele generische Klassen einzusetzen, kann auch ein Fehler sein.
Zum Beispiel kann man sich mit Vererbung sehr viel Arbeit ersparen:
<body>
<div class="fliesstext">Blub</div>
<div class="fliesstext">Blub</div>
<div class="fliesstext">Blub</div>
<div class="fliesstext">Blub</div>
<div class="fliesstext">Blub</div>
</body>
... ist nicht sonderlich sinnvoll. Besser wäre ...
<body class="fliesstext">
<div>Blub</div>
<div>Blub</div>
<div>Blub</div>
<div>Blub</div>
<div>Blub</div>
</body>
... oder gleich die Fliesstextangaben direkt für das body-Element definieren
und bei Bedarf überschreiben. Dies würde ich als das Grundprinzip beim
Erstellen eines Stylesheets bezeichnen: »Vom Allgemeinen zum Speziellen«.
Erst kümmert man sich um die allgemeinen Fällen, das heißt die allgemeinen,
vorhandenen HTML-Elemente und dort möglichst geschickt mit der Vererbung
agieren. Wenn einem das nicht ausreicht, dann sollte man die Spezialfälle in
einzelne, möglichst logische, strukturelle Klassen einteilen. Als letzter
Punkt kommt dann die Direktformatierung über IDs oder mittels des Attributes
style.
Tim