Cómo crear comentarios en CSS

Por Felipe

Publicado en:

Para crear un comentario en CSS debes encerrar el texto entre los símbolos /* y */. Todo lo que esté dentro será ignorado por el navegador y no se ejecutará. Los comentarios sirven para explicar el código, organizarlo en secciones o desactivar reglas temporalmente, y permanecen ocultos para los usuarios que visitan tu web.

En programación es habitual realizar anotaciones y comentarios para indicar para qué sirve una línea o un bloque de código. Esta práctica, muy útil para entender el código pasado un tiempo o para que lo comprenda un tercero, también es clave en el diseño web cuando trabajamos con CSS. Los comentarios en CSS aceleran el trabajo con las hojas de estilo, porque no hace falta detenerse a pensar qué hace cada regla: el comentario da información directa y precisa de para qué sirve. En esta guía con voz peruana te enseñamos cómo crearlos y aprovecharlos al máximo.

Cuándo crear comentarios en CSS

Puedes crear comentarios mientras escribes código HTML o diseñas el aspecto visual de tu web con CSS. Durante todo el proceso de desarrollo es necesario y recomendable utilizarlos para facilitar el trabajo, evitar pérdidas de tiempo y fomentar el trabajo colaborativo. Una vez terminado el desarrollo, puedes eliminar los comentarios que no aporten valor y dejar solo los que realmente ayudan a comprender lo que hace una línea o un bloque de código.

Otro uso muy práctico de los comentarios es desactivar temporalmente algunos valores de la hoja de estilo. Para ello se rodea el código con los símbolos /* y */, de modo que no se ejecute. En cualquier momento puedes borrar esos símbolos para volver a activarlo, algo muy útil cuando estás probando distintos estilos y quieres comparar resultados.

Cómo se escribe un comentario en CSS

En CSS los comentarios se indican abriendo con /* y cerrando con */. Por ejemplo:

width: 250px; /* Ancho del menú */

Todo el texto que se encuentre entre esos símbolos es considerado por el CSS como un comentario y, por lo tanto, no se ejecutará como si fuera una regla o un comando. Un detalle importante: estos comentarios siempre permanecen ocultos para los visitantes cuando acceden al sitio desde su navegador. El usuario solo podrá verlos si entra al código fuente utilizando el modo desarrollador (o una opción similar) de su navegador.

Comentarios de una y varias líneas

Los comentarios en CSS pueden ser principalmente de dos clases:

  • De una sola línea: se añaden a continuación de una regla CSS para indicar, de forma breve, qué hace.
  • De varias líneas: se usan para dar información más detallada, señalar que falta código por añadir o explicar un bloque completo.

Un ejemplo de comentario de varias líneas sería:

/*
  Estilos del encabezado
  Última modificación: junio 2026
*/

Tipos de comentarios en CSS más usados

Durante el desarrollo web es habitual emplear distintos tipos de comentarios en el código o en las etiquetas CSS:

  • Aclaratorios: explican de forma detallada un valor o una regla CSS.
  • Deshabilitar código: hacen que una parte concreta del CSS no se ejecute de manera temporal.
  • Separador de código: se colocan entre secciones o bloques para aclarar su función; por ejemplo, para indicar que lo que viene a continuación corresponde al footer de la página.
  • Información: incluyen datos como la versión del código, la fecha de modificación, el tipo de licencia o el autor. Suelen agruparse al principio o al final del archivo.

Buenas prácticas al comentar en CSS

A diferencia de otros lenguajes como JavaScript, CSS solo admite el formato de comentario con /* y */; no existe el comentario de una sola línea con doble barra. Por eso es importante cerrar siempre cada comentario, ya que olvidar el */ puede provocar que el navegador ignore las reglas que vienen después. Otra buena práctica es comentar con criterio: explica el porqué de una decisión de diseño y no lo que ya resulta evidente, porque comentar de más puede ensuciar el código tanto como no comentar nada. Por último, recuerda que en producción conviene minificar el CSS para eliminar comentarios y espacios; así el archivo pesa menos y tu web carga más rápido, mientras conservas la versión comentada para seguir trabajando.

Organiza tu CSS (y tu web) para crecer

Los comentarios son un recurso muy valioso para organizar el código y lograr una estructura más definida y fácil de comprender. Al principio, una hoja de estilos suele ser básica y ocupar pocas líneas; pero a medida que diseñas cada elemento, cambias propiedades y agregas funciones, el CSS crece de manera considerable y puede volverse ilegible. Sin comentarios, encontrar exactamente la regla que quieres modificar se convierte en una tarea lenta.

Por eso, muchos programadores front-end colocan un índice al inicio de su CSS usando comentarios, con el fin de localizar cualquier elemento o regla en el futuro y hacer cambios de forma rápida y sencilla. Y así como ordenas tu código, también conviene apoyar tu web en una base sólida. En HostingPlus, el hosting N°1 del Perú, trabajamos desde 2004 con discos SSD/NVMe, tecnología LiteSpeed, certificado SSL incluido, migración gratuita y soporte 24/7 desde un datacenter de primer nivel. Si quieres que tus hojas de estilo carguen rápido y tu proyecto crezca sin límites, revisa nuestros planes de hosting.

Preguntas frecuentes

¿Cómo se escribe un comentario en CSS?

Se escribe encerrando el texto entre /* y */. Por ejemplo: /* Este es un comentario */. Todo lo que esté dentro será ignorado por el navegador y no afectará el estilo de tu web.

¿Los usuarios pueden ver los comentarios de CSS?

No durante la navegación normal. Los comentarios permanecen ocultos y solo se pueden ver si alguien inspecciona el código fuente con el modo desarrollador del navegador. Aun así, conviene no incluir información sensible en ellos.

¿Para qué sirve comentar el código CSS?

Sirve para explicar qué hace cada regla, organizar el código en secciones, desactivar estilos temporalmente y facilitar que tú u otra persona puedan mantener la hoja de estilos en el futuro. Ahorra mucho tiempo a largo plazo.

¿Tu web necesita el hosting N°1 del Perú?

Hosting peruano con soporte real 24/7, migración gratis, SSL incluido y 30 días de garantía. Desde S/.70 al año.

Ver planes de hosting →