Obwohl ich schon einmal CSS und Div verstanden habe, wusste ich wirklich nichts über die Kompatibilität von Browsern. Dieses Mal, nach der Einführung von Freunden, etc., gibt es CSS-Hack dieses magische Ding. Ich habe es nach dem Ausprobieren gefunden, dass es wirklich gut funktioniert. Viele Leute haben Probleme mit der Kompatibilität des Browsers und haben mit CSS-Hack alles gelöst. Geben Sie den CSS-Hack direkt an.
CSS Hack ist eine Abhilfe, wenn Standard-CSS nicht kompatibel mit den verschiedenen Browser-Display - Effekten verwendet werden, bevor die Hersteller von Browsern analysieren CSS nicht vereinbart, können wir nur diese Methode verwenden, um solche Aufgaben zu erledigen.
Bei der Frontend-Entwicklung habe ich ungefähr folgende Browser getestet: IE7, IE6, Opera9 (Version 9.25 8825 zum Zeitpunkt des Schreibens), Safari3 (Version 3.0.4 523.15 zum Zeitpunkt des Schreibens), Firefox2 (2.0.0.11 zum Zeitpunkt des Schreibens).
Auf der Grundlage des normalen Selector {property: value;} wird Hack häufig für dasselbe Element verwendet, um die Einheitlichkeit zwischen Browsern zu erreichen.
Serien:
selector {+property: value;} mit dem Pluszeichen "+" in den Namen der Eigenschaft, dieser Hack kann nur die IE-Serie erkennen.
selector {* property: value;} mit dem Sternchen „*" in den Namen der Eigenschaft, dieser Hack kann nur die IE-Serie erkennen.
selector {_property: value;} Unterstrich "_ " in den Namen der Eigenschaft, dieser Hack ist nur von der IE-Familie (außer IE7) erkannt.
* html selector {property: value;} Vererben Sie * html selector auf den Selektor, dieser Hack kann nur die IE-Familie (außer IE7) erkennen.
html/** / > body selector {property: value;} Vererbung des Selektors/** / > body selector, dieser Hack kann nur die IE-Serie (außer IE7) erkennen.
Selektor {Eigenschaft}/** /: value; } Fügen Sie einen Kommentar zwischen dem Attributnamen und dem Doppelpunkt ":" ein, um die Verwendung von IE6 zu verhindern.
Der Selektor/** Eigentum {/** /: value; } Kommentare zwischen dem Selektor und den Klammern "{" und zwischen dem Attributnamen und dem Doppelpunkt ":" hinzufügen, um die Verwendung von IE5 und IE6 (nicht von IE5.5) zu masken.
Auswählen/** / {property: value;} Fügt einen Kommentar zwischen dem Selektor und den Klammern "{" ein, um die Verwendung von IE5 zu verhindern.
* + html Selektor {property: value! important;} Vererbung auf den Selektor * + html selector plus! wichtig, Dieser Hack kann nur IE7 erkennt.
Firefox:
*: lang (lang) selector {property: value! important;} mit der falschen Klasse lang (Sprache) hinzufügen! Die Definition von important kann derzeit nur von Firefox erkannt werden.
Safari:
Selector: empty {Property: value! important;} mit der falschen Klasse empty hinzufügen! Die Definition von important ist derzeit nur von Safari erkannt.
Oper:
@ media all and (min-width: 0px) {selector {property: value;}} Wenn es mit einer speziellen Vererbung definiert wird, kann es derzeit nur von Opera erkennen.
Der Hack ist nicht vollständig und ergänzt alle zusammen.
Die am häufigsten verwendeten Hacks sind CSS-Box - Modell-Hack, Clearing Floating-Hack.
Das CSS-Box - Modell hat einen schweren Parserfehler in IE5.X. Dieser Hack für IE5.x:
selctor {width: IE5.X Breite; voice-family: ""} ""; voice-family: inherit; width: richtige Breite;}
Clearing Floating Hack, glauben viele Menschen, die diese Definition verwendet:
selector: after {inhalte: "."; display: block; height: 0; clear: both; visibility: hidden; }
另外还有很多很多CSS Hack的运用,一一列举的话可能能写成一本书了…想到再添加吧.