Tipps und Tricks: Attributabhängige Formatierungen
Ab CSS 2 kannst Du Elementen Formatierungen zuweisen, wenn sie ein bestimmtest Attribut enthalten oder wenn ein Attribut einen bestimmten Wert hat. Das Interessante dabei ist, dass Du für diese Attribute einen beliebigen Namen vergeben darfst.
,
,
<html>
<head>
<style type="text/css">
h1[title] { color:red; }
h1[kapitel="uebersicht"] { color:blue; }
div[spalte=links][zeile=oben] {border:1px solid #dddddd;}
*[lang=en]{quotes:"'" "'";}
</style>
<title>Attributabhängige Formatierungen</title>
</head>
<body>
<h1 title="Überschrift">Eine rote Überschrift</h1>
<h1 kapitel="uebersicht">Eine blaue Überschrift</h1>
<div spalte=links zeile=oben>
Ein div mit Rahmen
</div>
</body>
</html>
Dieses Beispiel weist dem <h1>-Tag eine rote Schriftfarbe zu, wenn es das title-Attribut enthält,
und eine blaue Schriftfarbe, wenn es das Attribut kapitel mit dem Wert "uebersicht" enthält.
Ein <div>-Bereich wird mit einem Rahmen gezeichnet, wenn in dem Tag die Attribute und Werte eingetragen sind,
wie oben in dem Beispiel zusehen ist.
Du erkennst bereits, dass dies eine sinnvolle Möglichkeit ist. Z.Z. leider nur für die Geckos Mozilla und Netscape ab Version 6.
Browser
Der Opera kennt nur die einfache Version Selektor[Attributname].
Browser, die diese Technik nicht kennen, ignorieren die Formatierungen.
Ob dies ein Problem ist oder ob Deine Seite auf diesen Seiten nur nicht so schön aussieht, wie Du es möchtest,
hängt nur davon ab, welche CSS-Eigenschaften Du in dem Fall verwendest.
Du solltest also auf jeden Fall mit den gängigen Browsern testen.