Cada sitio web está compuesto de elementos estructurales (que son dictados por HTML), funcionales y estilísticos. Las Hojas de Estilo en Cascada (CSS) se utilizan para dictar la apariencia (el «look and feel») de un sitio web. Estos estilos se mantienen separados de la estructura HTML para facilitar la actualización y la adhesión a los estándares web.

El problema con las hojas de estilo

Con el tamaño y la complejidad de muchos sitios web hoy en día, las hojas de estilo pueden llegar a ser bastante largas y engorrosas. Esto es especialmente cierto ahora que las consultas de los medios de comunicación sobre estilos de sitios web con capacidad de respuesta son una parte esencial del diseño, lo que garantiza que un sitio web tenga el aspecto que debería tener, independientemente del dispositivo. Estas consultas de medios por sí solas pueden añadir un número significativo de nuevos estilos a un documento CSS, lo que dificulta aún más el trabajo. Aquí es donde los comentarios CSS pueden convertirse en una ayuda inestimable para los diseñadores y desarrolladores de sitios web.

Comentarios Añadir estructura y claridad

Agregar comentarios a los archivos CSS de un sitio web es una excelente manera de organizar secciones de ese código para un lector humano que esté revisando el documento. También garantiza la consistencia cuando un profesional de la web retoma el trabajo donde otro lo deja, o cuando equipos de personas trabajan en un sitio.

Los comentarios bien formateados pueden comunicar aspectos importantes de la hoja de estilo a los miembros de un equipo que no estén familiarizados con el código. Estos comentarios también son muy útiles para las personas que han trabajado en el sitio antes pero no recientemente; los diseñadores web suelen trabajar en muchos sitios, y es difícil recordar las estrategias de diseño de uno a otro.

Para los ojos de los profesionales solamente

Los comentarios CSS no se muestran cuando la página se muestra en los navegadores web. Estos comentarios son sólo informativos, al igual que los comentarios HTML (aunque la sintaxis es diferente). Estos comentarios CSS no afectan a la visualización de un sitio de ninguna manera.

Adición de comentarios CSS

Añadir un comentario CSS es bastante fácil. Usted simplemente reserva su comentario con las etiquetas correctas de apertura y cierre de comentarios:

• Comience su comentario añadiendo

   /* 

• Cierre su comentario añadiendo

   */ 

Todo lo que aparece entre estas dos etiquetas es el contenido del comentario, visible sólo en el código y no en el navegador.

Un comentario CSS puede ocupar cualquier número de líneas. Aquí hay dos ejemplos:

/* ejemplo de borde rojo */
 div#border_red {
 borde: rojo sólido fino;
 }
/***************************.****************************  Secciones que se rompen
Muchos diseñadores organizan las hojas de estilo en trozos pequeños y fáciles de digerir que son fáciles de escanear cuando se leen. Normalmente, verá los comentarios precedidos y seguidos por una serie de guiones que crean grandes y obvios saltos en la página que son fáciles de ver. Aquí hay un ejemplo:
Estos comentarios indican el comienzo de una nueva sección de codificación.
  Código "Comentando Fuera"
Debido a que las etiquetas de comentario le dicen al navegador que ignore todo lo que hay entre ellas, puedes usarlas para desactivar temporalmente ciertas partes del código CSS. Esto puede ser útil al depurar o al ajustar el formato de la página web. De hecho, los diseñadores a menudo los usan para "comentar" o "desactivar" áreas de código para ver qué pasa si esa sección no forma parte de la página.
Para hacer esto, simplemente agregue la etiqueta de comentario de apertura antes del código que le gustaría comentar (deshabilitar); coloque la etiqueta de cierre donde desea que termine la parte deshabilitada. Nada entre esas etiquetas afectará la visualización de un sitio, permitiéndole depurar el CSS para ver dónde está ocurriendo un problema. A continuación, puede entrar y corregir ese problema y eliminar los comentarios del código.
  Consejos para comentar CSS
Como resumen, aquí hay algunos consejos para recordar para usar comentarios en tu CSS:

Los comentarios pueden abarcar varias líneas.
Los comentarios pueden incluir elementos CSS que no desea que un navegador muestre pero que no desea eliminar por completo. Recuerde eliminar los estilos no utilizados (en lugar de dejarlos fuera de comentario) si decide que no los necesita en el sitio web.
Utilice comentarios siempre que escriba CSS complicados para añadir estructura, aclarar decisiones de diseño e informar a futuros desarrolladores (o recordarse a sí mismo) sobre consideraciones importantes. Esto ahorra tiempo en el futuro para todos los involucrados.
Los comentarios también pueden incluir meta información como:

Autor
Fecha de creación
Derechos de autor



  Rendimiento
Aunque añadir demasiados comentarios puede afectar a la velocidad de descarga y al rendimiento de un sitio, no debe dudar en utilizarlos. Se necesitarían muchas líneas de comentarios para tener un impacto negativo significativo. Como tantos aspectos del diseño web, todo se reduce al equilibrio.