Cómo incluir hojas de estilo condicionales

La verdad es que desde siempre, forma y función van de la mano. Rapidez de carga, color, estética, diseño son, por suerte, valores subjetivos y en este mundo de las webs, hay de todo pero, como los navegadores interpretan los códigos de manera diferente, a veces se hace necesario establecer propiedades CSS diferenciadas para que los visitantes vea nuestro sitio tal y como deseamos y no como lo se le ocurre a otros.

Esto no siempre es posible a menos que hagamos caso de algunas opiniones extremas que nos dicen: "simplifiquen, simplifiquen, simplifiquen"; "letras negras sobre fondos blancos"; "el contenido lo es todo, no importa si es el diseño es aburrido".

No hay muchas alternativas para zanjar estas diferencias, a veces, agotados, no tenemos otro remedio que recurrir a los hacks o al uso de códigos condicionales aunque estos, como sólo son implementados por Internet Explorer sólo nos permiten establecer diferencias entre las distintas versiones de ese navegador y los otros:

<!--[if IE 5]>
  [esto sólo se ejecutará en IE versión 5]
<![endif]-->

<!--[if IE 5.5000]>
  [esto sólo se ejecutará en IE versión 5.5]
<![endif]-->

<!--[if IE 6]>
  [esto sólo se ejecutará en IE versión 6]
<![endif]-->

<!--[if IE 7]>
  [esto sólo se ejecutará en IE versión 7]
<![endif]-->

Y algunas más amplias pero siempre detectando Internet Explorer:

<!--[if lt IE 7]>
  [esto sólo se ejecutará en versiones inferiores a IE7]
<![endif]-->

Sólo hay dos posibilidades más, establecer códigos que se ejecuten sólo en Internet Explorer:

<!--[if IE]>
  [esto sólo se ejecutará en cualquier versión de Internet Explorer]
<![endif]>

Y establecer códigos que NO se ejecuten sólo en Internet Explorer pero si en cualquier otro navegador:

<!--[if !IE]>
  [esto sólo se ejecutará en cualquier navegador que NO sea Internet Explorer]
<![endif]>

¿Para qué sirve? Para corregir algunos detalles menores o para cargar una hoja de estilo distinta según sea el navegador del usuario. Lo más común es que sean las versiones inferiores a IE7 las que causen más problemas así que es usual encontrarse con cosas así:

<link rel="stylesheet" type="text/css" href="URL_estilo.css" />

<!--[if lt IE 7]>
  <link rel="stylesheet" type="text/css" href="URL_estiloIE.css" />
<![endif]-->

Donde se detecta las versiones inferiores de IE y, en esos casos, se carga una hoja de estilo especial que sobrescribe las propiedades CSS "normales".