XHTML : Les commentaires conditionnels

Les commentaires conditionnels permettent d'ajouter du code qui sera seulement interprété par Internet Explorer. Par exemple, cela est utile pour des designs non compatibles avec IE : on peut faire une feuille CSS qui corrigera les bugs sous IE sans avoir de conséquences sous les autres navigateurs. (Firefox, Safari, Opéra, Chrome, etc…)

Pour mettre en place ces commentaires conditionnels, c'est très simple : ce sont des commentaires (X)HTML avec une syntaxe particulière.

Cibler toutes les versions d'Internet Explorer

Pour indiquer qu'un code doit être seulement interprété par IE, il faut utiliser la syntaxe suivante :

<!--[if IE]>LE CODE<![endif]-->

Exemple(s)

<!--[if IE]>
    <link type="text/css" rel="stylesheet" href="styles/special-ie.css" />
<![endif]-->

<!--[if IE]>
    <strong>Vous utilisez IE.</strong>
<![endif]-->

Cibler tout les navigateurs sauf Internet Explorer

Pour indiquer qu'un code ne doit pas être interprété par IE, il faut utiliser la syntaxe suivante :

<!--[if !IE]> <--> LE CODE <!--> <![endif]-->

Exemple(s)

<!--[if !IE]><-->
    <link type="text/css" rel="stylesheet" href="styles/pas-ie.css" />
<!--><![endif]-->

<!--[if !IE]><-->
    <strong>Vous utilisez pas IE.</strong>
<!--><![endif]-->

Cibler une version précise d'Internet Explorer

La dernière version en date (IE 8) respecte un peu plus les standards W3C. Si vous voulez seulement ajouter du code pour IE7, c'est possible. Vous pouvez avec les commentaires conditionnels (X)HTML indiquer qu'un code doit être interprété par une version précise d'Internet Explorer.

Exemple(s)

<!--[if IE 6]>
    CODE pour IE 6
<![endif]-->

<!--[if IE 7]>
    CODE pour IE 7
<![endif]-->

<!--[if IE 8]>
    CODE pour IE 8
<![endif]-->

Vous pouvez aussi indiquer un ensemble de version en utilisant les mots-clés suivants :

• gt (supérieur stricte)
• gte (supérieur ou égale)
• lt  (inférieur stricte)
• lte (inférieur ou égale)

Exemple(s)

<!--[if gte IE 7]>
    CODE pour IE 7 et +
<![endif]-->

<!--[if lte IE 6]>
    CODE pour IE 6 et –
<![endif]-->