Heim > Artikel > Web-Frontend > Zusammenfassung der CSS-Hack-Sammlung
IE-Browser blockieren (d. h. er wird nicht unter IE angezeigt)
*:lang(zh) select {font:12px !important;} /*Special for FF*/
select:empty { font:12px !important;} /*sichtbar 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
*+html {…}
Sie können diesen HACK verwenden, wenn Sie Stile nur für IE7 erstellen müssen.
Identifikation für IE6 und niedriger
* html {…}
Viele Vermieter haben HACK für IE6 geschrieben. 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 es nicht
select { display /*IE6 erkennt es nicht*/:none;}
Hier geht es hauptsächlich darum, ein Attribut und einen Wert durch CSS-Kommentare zu trennen, die vor dem Doppelpunkt ausgegeben werden.
Nur IE6 und IE5 erkennen es nicht
select/**/ { display /*IE6, IE5 erkennt nicht*/:none;}
Der Unterschied zum obigen Satz besteht darin, dass zwischen dem Selektor ein zusätzliches CSS vorhanden ist und die geschweiften Klammern Hinweis.
Nur IE5 erkennt es nicht
select/*IE5 erkennt es nicht*/ { display:none;}
Dieser Satz entfernt den Kommentar im Attributbereich aus dem vorherigen Satz. Nur IE5 erkennt
Box-Modelllösung
select {width:IE5.x width; voice-family:inherit; width:correct width;}
Die Clearing-Methode des Box-Modells wird nicht über !important gehandhabt. Das muss klar sein.
Float löschen
select:after {content:“; clear:both perspective:hidden;}
In Firefox, wenn alle untergeordneten Elemente vorhanden sind Beim Floating kann die Höhe des übergeordneten Elements nicht das gesamte untergeordnete Element vollständig abdecken. Verwenden Sie dann diesen HACK, um das Floating zu löschen und das übergeordnete Element einmal zu definieren, wodurch dieses Problem gelöst werden kann.
Trunkation ellipsis
select { -o-text-overflow:ellipsis; text-overflow:white-space:nowrap }
Dies geschieht nach Überschreitung der Länge Schneiden Sie den überschüssigen Text automatisch ab und beenden Sie ihn mit Auslassungspunkten, was eine sehr gute Technik ist. Es ist nur so, dass Firefox es derzeit nicht unterstützt.
Wird nur von Opera erkannt
@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 werden verwendet, um lokale Kompatibilitätsprobleme zu lösen. 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.
Filter für IE5.x, nur IE5.x ist sichtbar
@media tty {
i{content:““;/*“ „*/}} @import 'ie5win .css'; /*“;}
}/* */
IE5/MAC-Filter werden im Allgemeinen nicht benötigt
[In Zwischenablage kopieren] [ - ]CODE:
/ ** //*/
@import „ie5mac.css“;
/**/
IE's if condition Hack
![endif]–>
Alle IE erkennen
Nur IE 5.0 🎜> Nur IE 5.0+
IE5.0 oder IE5.5 kann erkannt werden
< IE 6]> Nur IE 6-
Nur von IE6 erkannt
]–>
Kann von IE6 und IE5.x unterhalb von IE6 erkannt werden
Nur IE 7/- Nur von IE7 erkannt
Der obige Inhalt ist definitiv nicht vollständig. Ich möchte diese Techniken mit mir zusammenfassen, um zukünftige Arbeitsanfragen zu erleichtern. Gleichzeitig möchte ich mich bei denen bedanken, die diese HACKs recherchiert haben .
Weitere CSS-Hack-Sammlungen und verwandte Artikel finden Sie auf der chinesischen PHP-Website!