Sugerencias para Herramientas para desarrolladores: Cómo inspeccionar la cuadrícula de CSS

Sofía Emelianova
Sofía Emelianova

Las Herramientas para desarrolladores de Chrome hacen que la depuración de diseños de cuadrícula de CSS sea intuitiva con una variedad de opciones de visualización.

Mira el video para aprender a activar o desactivar la superposición de la cuadrícula en el panel Elementos y usarla con los siguientes fines:

Superposición de cuadrícula

  • Visualizar e inspeccionar diseños de cuadrícula
  • Consulta los números de fila y columna a los que debes referirte cuando coloques elementos de cuadrícula.
  • Usa los nombres de líneas y áreas, y míralos en la superposición si tienes muchos elementos de cuadrícula y los números son confusos.
  • Comprueba los tamaños de las pistas.

Además, con el editor de cuadrículas en el panel Elementos > Estilos, puedes alinear elementos y su contenido en un diseño de cuadrícula con un clic en lugar de escribir reglas de CSS.

El editor de cuadrícula

Si deseas obtener una experiencia de aprendizaje más práctica, sigue el instructivo Inspeccionar la cuadrícula de CSS.