Maison > interface Web > tutoriel CSS > Résumé de la collection CSS Hack

Résumé de la collection CSS Hack

高洛峰
Libérer: 2016-12-24 15:33:02
original
1996 Les gens l'ont consulté

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;} /*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.
Reconnu uniquement par IE7

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

* 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, il s'agit principalement 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 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
Solution du 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 flottement 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 en écriture 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 aussi bien 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 » ;
/**/
Si condition Hack

![endif]–>
Tous les IE reconnaissent
Seul IE 5.0
Seul IE5 peut être reconnu <.> Seul IE 5.0
IE5.0 ou IE5.5 peut être reconnu
Uniquement IE 6-
Uniquement reconnu par IE6
Uniquement IE 6/ < >
Peut être reconnu par IE6 et IE5.x sous IE6
Uniquement IE 7/- par IE7
Le contenu ci-dessus n'est certainement pas exhaustif. J'invite tout le monde à résumer ces techniques avec moi pour faciliter les futures demandes de travail. En même temps, je voudrais remercier ceux qui ont recherché ces HACK. 🎜>



Pour plus de collection CSS Hack et d'articles connexes, veuillez faire attention au site Web PHP chinois !

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
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
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal