Dizque



comentarios condicionales, CSS, Desarrollo web

Comentarios condicionales: del derecho y del revés

Saltar a Anotaciones relacionadas

Internet Explorer es un navegador obsoleto (lamentablemente, solo en la segunda acepción del término). Su peculiar forma de interpretar las hojas de estilo nos obliga a suministrarle, con cierta frecuencia, CSS llenos de hacks. Y esos hacks no validan / son incómodos de mantener / no nos gustan (táchese lo que no proceda).

Afortunadamente, los chicos de Microsoft incluyeron, a partir de la versión 5 de Internet Explorer, un método sencillo —e incluso aceptable— para detectar la versión del navegador y suministrarle contenidos apropiados a su edad mental.

La sintaxis utiliza comentarios que solo son reconocidos por IE:

<!-- Esto es un comentario HTML tradicional -->

<!--[if IE]> 
    Solo Internet Explorer ve este contenido. 
    Para el resto de los navegadores, es un 
    comentario.
<![endif]-->

Así pues, podemos utilizar este tipo de comentarios para alimentar a la bestia negra con una hoja de estilos ad hoc.

<!--[if IE]> 
    <link rel="stylesheet" type="text/css"
    href="/hoja/de/estilos/para/IE.css" />
<![endif]-->

No solo eso, también podemos destinar código únicamente a versiones concretas. Ya se ha escrito mil veces sobre el tema, así que no me extenderé. Los interesados podéis acudir a Comentarios condicionales para IE, en Diseñorama, o Sintaxi dels comentaris condicionals en a.css.

Solo para «los otros»

Y ahora, vayamos con el tema que me ha motivado a escribir esta notita: ¿qué hacer cuando queremos ocultar algo a Internet Explorer sin hacerlo invisible al resto de navegadores? Según Microsoft, usaremos lo que ellos llaman Downlevel-revealed Conditional Comments:

<![if !IE]>
    <p>Gracias por no utilizar una patata 
    para navegar por mi web.</p>
<![endif]>

Pero por desgracia, la sintaxis propuesto no es válida. Ni como HTML, ni como árbitro de tercera. En cambio, utilizando esta otra

<!--[if !IE]>-->
    <p>Gracias por no utilizar una patata 
    para navegar por mi web.</p>
<!--<![endif]-->

nuestro documento sigue siendo válido. Bravi!




2 comentarios RSS

¡Comentando el comentario condicional!
Buena ocurrencia.

  • #2
  • cristiandlr
  • 2008-04-24 05:09:01

Muy buen artículo, me ha sido bastante útil. Un saludo.


Di la tuya

Puedes usar markdown y estas etiquetas HTML: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <code> <em> <i> <strike> <strong> . Por favor, evita el abuso de las mayúsculas y cuida la ortografía.