Maison  >  Article  >  interface Web  >  Résumé de la collection CSS Hack_Experience Exchange

Résumé de la collection CSS Hack_Experience Exchange

WBOY
WBOYoriginal
2016-05-16 12:06:151537parcourir

Bloquez le navigateur IE (c'est-à-dire qu'il ne sera pas affiché dans IE)
*:lang(zh) select {font:12px !important;} /*Spécial pour FF*/
select:empty {font: 12px !important; } /*Visible en safari*/
Ici, select est le sélecteur, qui peut être modifié en fonction de la situation. La deuxième phrase est propre au navigateur Safari sur MAC.
Uniquement reconnu par IE7

*+html {…}
Vous pouvez utiliser ce HACK lorsque vous avez besoin de créer des styles uniquement pour IE7.
Identification de IE6 et inférieur

* html {…}
Portez une attention particulière à cet endroit De nombreux propriétaires ont écrit HACK pour IE6. En fait, IE5.x peut également reconnaître ce HACK. Les autres navigateurs ne le reconnaissent pas.
html/**/>body select {……}
Cette phrase a le même effet que la phrase précédente.
Seul IE6 ne le reconnaît pas

select { display /*IE6 ne le reconnaît pas*/:none;}
Ici, sépare principalement un attribut et une valeur via des commentaires CSS, qui sont publiés avant les deux points.
Seuls IE6 et IE5 ne le reconnaissent pas

select/**/ { display /*IE6, IE5 ne reconnaît pas*/:none;}
La différence ici par rapport à la phrase ci-dessus est qu'il y a un CSS supplémentaire entre le sélecteur et les accolades Remarque.
Seul IE5 ne le reconnaît pas

select/*IE5 ne le reconnaît pas*/ { display:none;}
Cette phrase supprime le commentaire dans la zone d'attribut de la phrase précédente. Seul IE5 ne reconnaît pas la
solution de modèle de boîte

selct {width:IE5.x width; voice-family:””}””; 🎜 >La méthode de compensation du modèle de boîte n'est pas gérée via !important. Cela doit être clair.
Effacer float

select:after {content:”.”; display:block; height:0; clear:both; flottant, la hauteur du parent ne peut pas couvrir complètement l'ensemble de l'enfant. Utilisez ensuite ce HACK pour effacer le flottant afin de définir le parent une fois, ce qui peut résoudre ce problème.
Ellipses de troncature

select { -o-text-overflow:ellipsis; text-overflow:ellipsis; white-space:nowrap; }
C'est après avoir dépassé la longueur. coupez automatiquement le texte en excès et terminez-le par des points de suspension, ce qui est une très bonne technique. C'est juste que Firefox ne le prend pas en charge actuellement.
Reconnu uniquement par Opera

@media all and (min-width : 0px){ select {……} }
Effectuez des paramètres séparés pour le navigateur Opera.
Ci-dessus sont quelques HACK dans l'écriture de CSS. Ceux-ci sont utilisés pour résoudre les problèmes de compatibilité locale. Si vous souhaitez séparer le contenu de compatibilité, vous pouvez également essayer les filtres suivants. Certains de ces filtres sont écrits en CSS pour importer des styles spéciaux via des filtres, et d'autres sont écrits en HTML pour lier ou importer les styles de correctifs requis via des conditions.

Filtre pour IE5.x, seul IE5.x est visible

@media tty {
i{content:"";/*" "*/}} @import 'ie5win .css'; /*”;}
}/* */
Les filtres IE5/MAC ne sont généralement pas nécessaires

[Copier dans le presse-papier] [ - ]CODE :
/ ** //*/
@import «ie5mac.css»;
/**/
IE if condition Hack


Seul IE
Tous les IE peuvent reconnaître
Seul IE 5.0
Seul IE5.0 peut reconnaître
Seul IE 5.0+
IE5.0 est garanti d'être remplacé par IE5.5 Tous peuvent être reconnus
Seul IE 6-
Seul IE6 peut être reconnu
Seul IE 6/+
IE6 et IE5.x inférieurs à IE6 peuvent être reconnu Reconnaissance
Seul IE 7/-
Seul IE7 peut reconnaître Le contenu ci-dessus n'est certainement pas exhaustif. J'invite tout le monde à se joindre à moi pour résumer ces compétences pour de futures demandes d'emploi. Offrez une commodité et remerciez ceux qui ont recherché ces HACKs

.

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn