HTML

Comentarios Condicionales

¿Qué son los comentarios condicionales?

Los comentarios condicionales son, justamente, comentarios en HTML que son interpretados por los navegadores y permiten ejecutar cierto código dependiendo del navegador que se esté utilizando. Es muy utilizado cuando se tienen diferentes archivos CSS dependiendo de la versión de Internet Explorer.

Son asociados comúnmente con Internet Explorer, pero los demás navegadores también los soportan, solo que no de un modo tan completo.

NOTA: En los ejemplos hay un asterisco después del primer signo menor, ese signo deben borrarlo, la razón por la que lo puse es que WordPress sino interpreta el código.

Hay 2 tipos de comentarios condicionales:

Downlevel-Hidden

Solo Internet Explorer los interpreta.

Downlevel-Revealed

Es interpretado por los demás navegadores (los que no soportan comentarios condicionales), así como también por IE. La diferencia está en que IE interpreta los operadores y los demás browsers no.

Sintaxis comentarios Downlevel-Hidden

<*!--[if expression]> HTML

Sintaxis comentarios Downlevel-Revealed

<*![if expression]> HTML

Expresiones admitidas.

IE, para cualquier versión de Internet Explorer.

IE X, para una versión especifica, se puede cambiar la X por la versión que se desee, desde IE 5, hasta IE 8.

Ejemplo:
<*!--[if IE]>Es IE<[endif]-->

Operadores.

| (OR), se debe escribir con el símbolo porque si ponemos OR no funciona.

& (AND), al igual que el OR solo funciona con el símbolo.

gt (greater), si es mayor que la versión especificada muestra el contenido.

gte ((greater or equal), si es mayor igual a la versión especificada muestra el contenido.

lt (less than), si es menor que la versión de IE.

lte (less than or equal), si es menor o igual a la versión de IE especificada.

¡ (not), negación.

(), los paréntesis se utilizan cuando se realizan comparaciones con OR o AND.

Ahora algunos ejemplos (el Downlevel no se debe especificar, solo lo hice para que les sea mas facil)

<*!--[if IE]>IE (donwlevel-hidden, solo lo ve IE)

<*![if !IE]>No es IE (donwlevel-revealed)

<*![if IE]>IE (donwlevel-revealed) (Se ve en todos los nevegadores)

<*![if !IE | IE]>Se ve en todos!! (donwlevel-revealed)

<*![if gte IE 5]>Si es mayor o igual a IE 5 (downlevel-revealed) (los demas navegadores lo muestra)

<*!--[if gte IE 5]>Si es mayor o igual a IE 5 (downlevel-hidden) (los demas navegadores NO lo muestra)

<*!--[if gte IE 5]>Si es mayor o igual a IE 5 (downlevel-hidden)

<*!--[if (gte IE 5) | (lte IE 8)]>(Si es mayor o igual a IE 5) OR (si es menor o igual a IE 8)(downlevel-hidden)

<*!--[if true]>Si es IE, debido a que solo IE lo puede ejecutar (downlevel-hidden)

<*!--[if false]>Solo IE lo puede ejecutar pero no lo muestra porque el valor booleano de la expresion es falso (downlevel-hidden)

Cualquier duda consulten en los comentarios, existen otros usos para los comentarios condicionales que seguramente ampliaré mas adelante.