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

Sofia Emelianova
Sofia 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 cuadrícula en el panel Elementos y usarla para lo siguiente:

Superposición de cuadrícula

  • Visualiza e inspecciona los diseños de cuadrícula.
  • Consulta los números de fila y columna a los que puedes consultar cuando coloques elementos de la cuadrícula.
  • Usa nombres de líneas y áreas, y míralo en la superposición si tienes muchos elementos de cuadrícula y los números son confusos.
  • Verifica los tamaños de los segmentos.

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

El editor de cuadrícula

Para obtener una experiencia de aprendizaje más práctica, sigue el instructivo Cómo inspeccionar la cuadrícula de CSS.