Comment cibler IE7 et IE8 avec CSS : un guide complet-tutoriel CSS-php.cn

Comment cibler IE7 et IE8 avec CSS : un guide complet

Linda Hamilton

Libérer： 2024-10-29 07:25:02

original

865 Les gens l'ont consulté

How to Target IE7 and IE8 with CSS: A Comprehensive Guide

Cibler IE7 et IE8 avec CSS : un guide complet

Pour obtenir un style ciblé pour IE7 et IE8 sans compromettre la conformité du W3C, l'utilisation de classes explicites spécifiques au navigateur est une méthode efficace méthode. Cela élimine le besoin de hacks CSS peu fiables.

Approche 1 : Classes HTML spécifiques au navigateur

Ajoutez des classes HTML au élément basé sur le navigateur :

<code class="html"><!doctype html>
<!--[if lt IE 7 ]> <html lang="en" class="ie6"> <![endif]-->
<!--[if IE 7 ]>    <html lang="en" class="ie7"> <![endif]-->
<!--[if IE 8 ]>    <html lang="en" class="ie8"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--><html lang="en"><!--<![endif]--></code>

Copier après la connexion

Cela vous permet de cibler des navigateurs spécifiques dans votre CSS :

<code class="css">.ie6 body { 
    border:1px solid red;
}
.ie7 body { 
    border:1px solid blue;
}</code>

Copier après la connexion

Approche 2 : CSS Hacks

Alternativement, vous pouvez utilisez des hacks CSS pour cibler les versions d'IE :

"9" cible IE8 et inférieur
"*" cible IE7 et inférieur
"_" cible IE6

Exemple :

<code class="css">body { 
border:1px solid red; /* standard */
border:1px solid blue; /* IE8 and below */
*border:1px solid orange; /* IE7 and below */
_border:1px solid blue; /* IE6 */
}</code>

Copier après la connexion

Cibler IE10

IE10 ne reconnaît pas les instructions conditionnelles. Pour le cibler, utilisez ce script :

<code class="html"><!doctype html>
<html lang="en">
<!--[if !IE]><!--><script>if (/*@cc_on!@*/false) {document.documentElement.className+=' ie10';}</script><![if lt IE 9]><![endif]-->
<head></head>
<body></body>
</html></code>

Copier après la connexion

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!