Vérification rapide du dernier résumé CSS Hack

Bloquer le navigateur IE (c'est-à-dire qu'il ne sera pas affiché sous IE)

*:lang(zh) select {font:12px !important;} /*Spécial pour FF*/
select:empty {font:12px !important;} /*safari visible*/

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 devez créer des styles uniquement pour IE7.

Identification IE6 et inférieure

*html{…}

Portez une attention particulière à ce point. De nombreux propriétaires ont écrit qu'il s'agit d'un 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 reconnaît pas*/:aucun;}

L'essentiel ici est de séparer un attribut et une valeur via des commentaires CSS, qui sont publiés avant les deux points.

Seuls IE6 et IE5 ne sont pas reconnus

select/**/ { display /*IE6, IE5 ne le reconnaît pas*/:none;}

La différence ici par rapport à la phrase ci-dessus est qu'il y a un commentaire CSS supplémentaire entre le sélecteur et les accolades.

Seul IE5 ne le reconnaît pas

select/*IE5 ne reconnaît pas*/ { display:none;}

Cette phrase est le commentaire dans la zone d'attribut supprimé de la phrase précédente. Seul IE5 ne le reconnaît pas

Solution de modèle de boîte

selct {width:IE5.x width; voice-family :""}""; voice-family:inherit;

La méthode de compensation du modèle de boîte n'est pas gérée via !important. Cela doit être clair.

flotteur clair

select:after {content:"."; display:block; clear:both:hidden;}

Dans Firefox, lorsque tous les enfants flottent, la hauteur du parent ne peut pas couvrir complètement l'ensemble de l'enfant. Utilisez ensuite ce HACK pour effacer le flottement afin de définir le parent une fois, ce problème peut alors être résolu.

Points de suspension tronqués

sélectionnez { -o-text-overflow:ellipsis; text-overflow:ellipsis; espace blanc:nowrap;

Il s'agit d'une très bonne technique qui coupera automatiquement le texte en excès lorsqu'il dépasse la longueur et le terminera par des points de suspension. C'est juste que Firefox ne le prend pas en charge actuellement.

Uniquement reconnu par Opera

@media all et (min-width : 0px){ select {……} }

Définissez des paramètres distincts 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.

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

Les filtres IE5/MAC ne sont généralement pas nécessaires

IE si conditionnel Hack

<!--[if IE]> IE uniquement <![endif]-->

Tout IE reconnaît

<!--[if IE 5.0]> Uniquement IE 5.0 <![endif]-->

Seul IE5.0 peut le reconnaître

<!--[if gt IE 5.0]> Uniquement IE 5.0+ <![endif]-->

IE5.0 peut être reconnu par IE5.5

<!--[if lt IE 6]> Uniquement IE 6- <![endif]-->

Uniquement reconnu par IE6

<!--[if gte IE 6]> Uniquement IE 6/+ <![endif]-->

Peut être reconnu par IE6 et IE5.x sous IE6

<!--[if lte IE 7]> Uniquement IE 7/- <![endif]-->

Uniquement reconnu par IE7

Le contenu ci-dessus n'est peut-être pas exhaustif. Vous êtes invités à vous joindre à moi pour résumer ces techniques afin de faciliter les futures recherches professionnelles. En même temps, je voudrais remercier les auteurs qui ont étudié ces HACK.