Vamos con un ejemplo sencillo a la vez que útil dentro de nuestros ejemplos sobre CSS. Y es que hoy vamos a hablar de cómo podemos poner comentarios en CSS. Para ello vamos a partir de un código CSS muy sencillo del que no vamos a entrar en su funcionalidad, ya que aquí nos vamos a enfocar en los comentarios y como podemos utilizarlos en nuestro código.
h1 {
color: red;
font-size: large;
}Tenemos que saber que en CSS podemos poner comentarios de 2 formas y que los podemos utilizar de diferentes maneras. Así que lo primero será saber las 2 formas que hay para poner comentarios. La primera será un comentario de una línea. Este comentario lo ponemos entre los caracteres /* y */.
/* Comentario en una sola línea */
Con los mismos caracteres podemos obtener la segunda forma de crear comentarios en CSS que son los comentarios en varias líneas. Sería la misma forma pero poniendo líneas entre el texto del comentario.
/*
Comentario
en varias
líneas
*/
Estas dos formas las podemos utilizar en cualquier parte de nuestro código CSS para poder poner comentarios. Pero se suele utilizar en dos casos para situaciones muy útiles. La primera será para poder comentar una propiedad de nuestro código CSS. Es decir, lo que hacemos es documentar la funcionalidad para la que estamos utilizando la propiedad sobre la que ponemos el comentario.
h1 {
color: red; /* Comentario tras propiedad */
font-size: large;
}La segunda será para poder desactivar una propiedad concreta del código CSS. En este caso lo que se hace es comentar la propiedad entera. Esto suele ser muy útil cuando estamos creando, modificando o depurando nuestro código en fases de desarrollo. Cierto es que la idea sería eliminar este tipo de comentarios cuando subamos nuestro código a entornos productivos, para que así quede lo «más limpio» posible.
h1 {
color: red;
/* font-size: large; */
}Así, todas las formas que hemos revisado en este artículo quedarían resumidas en este código:
/* Comentario en una sola línea */
/*
Comentario
en varias
líneas
*/
h1 {
color: red; /* Comentario tras propiedad */
/* font-size: large; */
}Espero que, aunque sea algo sencillo, os haya resultado de utilidad este código.
