Cada sitio web está compuesto por elementos estructurales, funcionales y estilísticos. Hojas de estilo en cascada dictar la apariencia (la "apariencia") de un sitio web. Estos estilos se mantienen separados de la estructura HTML para facilitar la actualización y el cumplimiento de los estándares web.
El problema con las hojas de estilo
Con el tamaño y la complejidad de muchos sitios web actuales, las hojas de estilo pueden volverse bastante largas y engorrosas. Este problema ha aumentado en complejidad ahora que preguntas de los medios por estilos de sitios web adaptables son una parte esencial del diseño, lo que garantiza que un sitio web se vea como debería independientemente del dispositivo. Solo esas consultas de medios pueden agregar una cantidad significativa de estilos nuevos a un documento CSS, lo que hace que sea aún más difícil trabajar con ellos. La gestión de esta complejidad es donde los comentarios CSS pueden convertirse en una ayuda invaluable para los diseñadores y desarrolladores de sitios web.
Los comentarios añaden estructura y claridad
Agregar comentarios a los archivos CSS de un sitio web organiza secciones de ese código para un lector humano que revisa el documento. También garantiza la coherencia cuando un profesional web retoma donde otro lo deja, o cuando equipos de personas trabajan en un sitio.
Los comentarios bien formateados comunican aspectos importantes de la hoja de estilo a los miembros de un equipo que pueden no estar familiarizados con el código. Estos comentarios también son útiles para las personas que han trabajado en el sitio antes pero no lo han hecho recientemente; Los diseñadores web suelen trabajar en muchos sitios y es difícil recordar las estrategias de diseño de uno a otro.
Solo para los ojos de los profesionales
Los comentarios CSS no se muestran cuando la página se procesa en navegadores web. Esos comentarios son solo informativos, al igual que Comentarios HTML son (aunque la sintaxis es diferente). Estos comentarios CSS no afectan la visualización de un sitio de ninguna manera.
Agregar comentarios CSS
Agregar un comentario CSS es bastante fácil. Fije su comentario con las etiquetas de comentario de apertura y cierre correctas:
Comience su comentario agregando /* y ciérralo con */.
Todo lo que aparezca entre estas dos etiquetas es el contenido del comentario, visible solo en el código y no representado por el navegador.
Un comentario CSS puede ocupar cualquier número de líneas. A continuación, se muestran dos ejemplos:
/ * ejemplo de borde rojo * /
div # border_red {
borde: rojo sólido delgado;
}
/***************************
****************************
Estilo para el texto del código
****************************
***************************/
Separación de secciones
Muchos diseñadores organizan las hojas de estilo en fragmentos pequeños y fáciles de digerir que son fáciles de escanear durante la lectura. Por lo general, verá comentarios precedidos y seguidos de una serie de guiones que crean saltos grandes y obvios en la página que son fáciles de ver. Aquí hay un ejemplo:
/ * Estilos de encabezado * /
Estos comentarios indican el inicio de una nueva sección de codificación.
Código de comentario
Debido a que las etiquetas de comentario le dicen al navegador que ignore todo entre ellas, puede usarlas para deshabilitar temporalmente ciertas partes del código CSS. Este truco puede ser útil cuando está depurando o cuando ajusta 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é sucede si esa sección no es parte de la página.
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, lo que le ayudará a depurar el CSS para ver dónde está ocurriendo un problema. Luego puede ingresar y corregir ese problema técnico y luego eliminar los comentarios del código.
Consejos para comentar CSS
Muchos codificadores incluyen bloques de comentarios en la parte superior de cualquier archivo nuevo con código. Imite esa estrategia al incluir un bloque de comentarios con su nombre, fechas relevantes e información relacionada para ayudar las personas comprenden el contexto de un proyecto y no solo las decisiones sobre lo que ocurre en relación con un código específico cuadra.