Usando comentarios condicionales en HTML

Question

Soy relativamente nuevo en desarrollo web y aprendizaje todo el tiempo. Recientemente he encontrado 'Comentarios condicionales' al ver el código fuente de diferentes sitios web. Creo que ahora entiendo lo que hacen, pero no estoy seguro de cuándo usarlos.

He visto que se utilizan principalmente para implementar diferentes hojas de estilo cuando se trata de IE y me gustaría saber si esto es una buena práctica.

En cuyo caso, si la respuesta es 'Sí'. Luego, cuando se desarrolla un sitio, es "un lugar común" usar dos hojas de estilo separadas para corregir errores, por ejemplo, crear una hoja de estilo para IE y otra para Firefox, Opera, etc?

Gracias de antemano.

Answer 1

Los comentarios condicionales solo son compatibles con IE, que yo sepa, y bajan con gracia en los navegadores que no los admiten (ya que parecen un comentario normal). El consenso general es que está bien utilizar una función de navegador no estándar si la está utilizando para combatir otra función no estándar de navegador " " (es decir, el soporte de mierda para CSS en IE). Así que descubrirás que es una solución muy común para ajustar CSS.

Answer 2

La naturaleza de Internet Explorer (versión 6 especialmente ) hace que algunas hojas de estilo funcionen bien con IE, y otras no. Para los fines de aquellos que no lo son, puedes usar comentarios condicionales para tener un código CSS que solo se muestra para IE. Tengo que usarlo debido a cómo Internet Explorer (mis) maneja los menús desplegables de CSS.

Para hacer que el sitio web en el que estoy trabajando represente correctamente la función hover del menú desplegable, tengo que implementar el archivo crosshover.htc. Aquí está el código que tengo que usar:

     <!--[if IE]>
<style type="text/css" media="screen">
#menu ul li {float: left; width: 100%;}
</style>
<![endif]-->
<!--[if lt IE 7]>
<style type="text/css" media="screen">
body {
behavior: url(http://www.stannscatholicschool.com/csshover.htc);
font-size: 100%;
}
#menu ul li {float: left; width: 100%;}
#menu ul li a {height: 1%;}

#menu a, #menu h2 {
font: 100% verdana, tahoma, helvetica, arial, sans-serif;
}

</style>
<![endif]-->

Si no lo hago, el menú desplegable se divide y no se puede navegar en Internet Explorer 6.

Answer 3

He usado comentarios condicionales para detectar si los visitantes de mi sitio usan IE6 o inferior. Si ese es el caso, cargo el secuencia de comandos de IE7.js , que supera algunos De los errores en estos navegadores antiguos. También hay un script para emular el soporte de IE8.

Answer 4

Algunas personas también usan comentarios para ayudar a delinear ciertas áreas de la página como un pie de página, encabezado o contenido principal (a menudo en plantillas).

Sin embargo, si está utilizando divs y CSS (que suena como si lo estuviera), debería poder decir qué contenido es o qué área del HTML está en las identidades DIV y estilos CSS. Recuerde usar nombres claros e intente no abreviarlos solo por escribir más fácilmente.

Si ese es un problema para usted, Intellisense es algo maravilloso y puede ayudarnos a solucionar este tipo de cosas. Si no, CTRL + C y CTRL + V son probablemente la mejor opción :)

Answer 5

¡Esta es una gran práctica! La página de documentación oficial de comentarios condicionales , tiene muchos ejemplos y combinaciones de Comentarios condicionales, vale la pena leerlo. La página también indica que:

Los comentarios condicionales facilitan a los desarrolladores aprovechar las funciones mejoradas que ofrece Microsoft Internet Explorer 5 y versiones posteriores, al tiempo que escriben páginas que se degradan con gracia en navegadores menos capaces o se muestran correctamente en navegadores que no sean Windows Internet Explorer. Los comentarios condicionales son el medio preferido para diferenciar las reglas de las Hojas de estilo en cascada (CSS) destinadas a versiones específicas de Internet Explorer.

Hoy en día, Internet Explorer es el navegador con menos capacidad , por lo que es muy probable que uses comentarios condicionales para hacer exactamente lo contrario, es decir, para aprovechar las funciones mejoradas que ofrecen todos los demás. los navegadores, mientras escriben páginas que se degradan con gracia en Microsoft Internet Explorer.

Puedes usar comentarios condicionales para arreglar estilos de CSS no compatibles o para ocultar código de Internet Explorer, como esto:

<!--[if !IE]>-->
<script src="IE_will_never_see_this.js" type="text/javascript" charset="utf-8" ></script>
<!--<![endif]-->