CSS Rückwärtskompatibilität und Fehlerbehandlung
Anzeige Hier werben
In CSS können dank der durchdachten Fehlerbehandlung auch neuartige Eigenschaften und Werte, die nicht alle Browser unterstützen, benutzt werden.
In CSS werden dem Browser unbekannte Eigenschaften und Werte einfach ignoriert.
Unbekannte Eigenschaften
1 2 3 4 | h1 {
opacity: .6;
color: #000;
}
|
Die opacity Eigenschaft (neu in CSS3) wird einfach in Browsern, die diese nicht kennen ignoriert und de restlichen Eigenschaften aber normal weiterverarbeitet. Woraus dann für den Browser folgende CSS Deklaration entsteht:
1 2 3 | h1 {
color: #000;
}
|
Unbekannte Werte
Unbekannte Werte werden in Browsern einfach ignoriert und nicht zugewiesen.
Rückwärtskompatibilität
Dadurch dass Zuweisungen mit nicht bekannten Werten ignoriert werden kann man für ältere Browser einen unterstützen Wert zuweisen, der möglichst nahe an das gewünschte Verhalten kommt.
Dazu ein Beispiel: Wir wollen einen Kasten mittels static fest auf einer Seite positionieren. So dass er auch wenn man scrollt an der selben Stelle bleibt. Dies wird aber z.B. im Internet Explorer 6 nicht unterstützt. Dadurch würde das Element gar nicht positioniert werden. Am nächsten an static kommt eine Positionierung mittels absolute. Also schreiben wir:
1 2 3 4 | div {
position: absolute;
position: fixed;
}
|
Kennt der Browser die Eigenschaft fixed nicht. Wird die Zuweisung einfach ignoriert:
1 2 3 | h1 {
position: absolute;
}
|
Bei einem Browser, der fixed kennt wird die erste Zuweisung von der zweiten überschrieben und es ergibt sich diese Deklaration:
1 2 3 | h1 {
position: fixed;
}
|
Diese Seite kann von jedem registrierten Benutzer bearbeitet werden. Bisher haben 2 Personen an der Seite "CSS Rückwärtskompatibilität und Fehlerbehandlung" mitgewirkt.
Sie haben einen Fehler entdeckt oder möchten etwas ergänzen? Dann können Sie nach der Anmeldung "CSS Rückwärtskompatibilität und Fehlerbehandlung" hier bearbeiten.
-
arbeitet seit längerem als Webdesigner und vor allem -entwickler. Er ist Webmaster von Webmasterpro.de und leitet den Flashcounter-Service.
-
graphic, motion & web design - kernreaktor - mutter kind turnen
Width
Dies kann aber auch ziemlich nervig werden, bzw. dank der tollen css unterstützung des IEs macht es immer sehr viel spaß das "min-width" aktueller browser und "width" der IEs zu vereienen...
Re: Width
Dann benutz doch einfach !important ;)
Re: Width
Wo denn? Wie denn?
Re: Width
Ich denk Fabian meint http://standards.webmasterpro.de/index-article-min_height.html hier steht aber in den Kommentaren schon, dass das mit min-width nicht klappt. Habs aber nicht extra ausprobiert.
Re: Width
Mhh hätte jetzt gedacht, dass das das Selbe wie mit min-width wäre...
Re: Width
Wie gesagt, ich hab das nicht getestet. Evtl. klappts auch irgendwie ;-)