CSS-Hack-Zusammenfassung, Kurzanleitung, Browser-Kompatibilität muss bekannt sein

CSS-Hack-Zusammenfassung, Kurzanleitung, Browser-Kompatibilität muss bekannt sein_Experience Exchange

WBOY

Freigeben： 2016-05-16 12:05:03

Original

1625 Leute haben es durchsucht

Blockieren Sie den IE-Browser (d. h. er wird nicht im IE angezeigt)

Kopieren Sie den Code Der Code lautet wie folgt:

 *:lang(zh) select {font:12px !important;} /*FF sichtbar, besondere Aussage: Aufgrund des neuesten Updates von Opera ist dieser Satz nun zu einem speziellen HACK für FF geworden* / 
select:empty {font:12px !important;} /*visible in Safari*/ 
Hier ist select der Selektor, der je nach Situation geändert werden kann. Der zweite Satz gilt nur für den Safari-Browser auf dem MAC. 

Nur von IE7 erkannt

Kopieren Sie den CodeDer Code lautet wie folgt:

 *+html {…} 
Sie können diesen HACK verwenden, wenn Sie Stile nur für IE7 erstellen müssen. 

Erkennung von IE6 und darunter

Code kopieren Der Code lautet wie folgt:

* html {…} 
Achten Sie besonders auf diesen Ort. Viele Vermieter haben geschrieben, dass es sich um einen HACK für IE6 handelt. Tatsächlich kann IE5.x diesen HACK auch erkennen. Andere Browser erkennen es nicht. 
html/**/ >body select {……} 
Dieser Satz hat die gleiche Wirkung wie der vorherige Satz. 

Nur IE6 erkennt nicht

Code kopieren Der Code lautet wie folgt:

select { display /*IE6 wird nicht erkannt*/:none;} 
Hier trennt ein Attribut und Wert hauptsächlich durch CSS-Kommentare, die vor dem Doppelpunkt ausgegeben werden. 

Nur IE6 und IE5 werden nicht erkannt

Code kopieren Der Code lautet wie folgt:

 
select/**/ { display /*IE6, IE5 erkennt nicht*/:none;} 
Der Unterschied zum obigen Satz besteht darin, dass zwischen dem Selektor und den geschweiften Klammern ein zusätzlicher CSS-Kommentar steht. 

Nur IE5 erkennt nicht

Code kopieren Der Code lautet wie folgt:

select/*IE5 erkennt es nicht*/ { display:none;} 
Dieser Satz ist der Kommentar im Attributbereich, der aus dem vorherigen Satz entfernt wurde. Nur IE5 erkennt 

Box-Modelllösung

Code kopieren nicht. Der Code lautet wie folgt:

 
select {width:IE5.x width; voice-family:inherit; width:correct width;} 
Die Löschmethode des Box-Modells ist nicht über !important of gehandhabt. Das muss klar sein. 

Float löschen

Code kopieren Der Code lautet wie folgt:

 
select :after {content:"."; display:block; height:0; clear:both:hidden;} 
Wenn alle untergeordneten Elemente schweben, kann die Höhe des übergeordneten Elements nicht vollständig sein Wickeln Sie das gesamte untergeordnete Element ein und verwenden Sie dann diesen schwebenden HACK, um das übergeordnete Element einmal zu definieren. Dann kann dieses Problem gelöst werden. 

Trunkierungsauslassungspunkte

Code kopieren Der Code lautet wie folgt:

 
 select { -o-text-overflow:ellipsis; white-space:nowrap:hidden } 
Dadurch wird der überschüssige Text automatisch abgeschnitten und mit einem beendet Auslassungspunkte sind eine gute Technik. Es ist nur so, dass Firefox es derzeit nicht unterstützt. 

Nur Opera erkennt

Kopieren Sie den CodeDer Code lautet wie folgt:

 
 @media all and (min-width: 0px){ select {……} } 
Nehmen Sie separate Einstellungen für den Opera-Browser vor. Die oben genannten HACKs zum Schreiben von CSS dienen zur Lösung lokaler Kompatibilitätsprobleme. Wenn Sie den Kompatibilitätsinhalt trennen möchten, können Sie auch die folgenden Filter ausprobieren. Einige dieser Filter sind in CSS geschrieben, um spezielle Stile über Filter zu importieren, und andere sind in HTML geschrieben, um erforderliche Patch-Stile über Bedingungen zu verknüpfen oder zu importieren. 

Filtern Sie nach IE5.x, nur IE5.x ist sichtbar

Kopieren Sie den CodeDer Code lautet wie folgt:

 
@media tty { 
i{content:"";/*" "*/}} @import 'ie5win.css';} 
}/* */ 

IE5/MAC-Filter werden im Allgemeinen nicht benötigt

Kopieren Sie den Code Der Code lautet wie folgt:

 
/**//*/ 
@import "ie5mac.css" 
/**/ 

IE's if condition Hack

Code kopieren Der Code lautet wie folgt:

 
Alle IE können es erkennen
 erkannt
 6]> Nur IE 6/ +![endif]--> 
Kann von IE6 und IE5.x unter IE6 erkannt werden
 
Nur ​​IE7 kann den oben genannten Inhalt erkennen, der möglicherweise nicht vollständig ist, um diese Techniken zur Vereinfachung zusammenzufassen für zukünftige Arbeitsanfragen. Gleichzeitig vielen Dank an die Autoren, die diese HACKs entwickelt haben 
.