Suggerimenti per DevTools: come esaminare la griglia CSS
Mantieni tutto organizzato con le raccolte
Salva e classifica i contenuti in base alle tue preferenze.
Chrome DevTools semplifica il debug dei layout a griglia CSS con una serie di opzioni di visualizzazione.
Guarda il video per scoprire come attivare/disattivare l'overlay della griglia nel riquadro Elementi e come utilizzarlo per:

- Visualizza e controlla i layout a griglia.
- Consulta i numeri di riga e colonna a cui fare riferimento quando posizioni gli elementi della griglia.
- Utilizza i nomi di linee e aree e visualizzali sull'overlay se hai molti elementi della griglia e i numeri sono confusi.
- Controlla le dimensioni della traccia.
Inoltre, con l'editor di griglie nel riquadro Elementi > Stili, puoi allineare gli elementi e i relativi contenuti in un layout a griglia con un solo clic, anziché digitare le regole CSS.

Per un'esperienza di apprendimento più pratica, segui il tutorial Esaminare la griglia CSS.
Salvo quando diversamente specificato, i contenuti di questa pagina sono concessi in base alla licenza Creative Commons Attribution 4.0, mentre gli esempi di codice sono concessi in base alla licenza Apache 2.0. Per ulteriori dettagli, consulta le norme del sito di Google Developers. Java è un marchio registrato di Oracle e/o delle sue consociate.
Ultimo aggiornamento 2022-08-18 UTC.
[[["Facile da capire","easyToUnderstand","thumb-up"],["Il problema è stato risolto","solvedMyProblem","thumb-up"],["Altra","otherUp","thumb-up"]],[["Mancano le informazioni di cui ho bisogno","missingTheInformationINeed","thumb-down"],["Troppo complicato/troppi passaggi","tooComplicatedTooManySteps","thumb-down"],["Obsoleti","outOfDate","thumb-down"],["Problema di traduzione","translationIssue","thumb-down"],["Problema relativo a esempi/codice","samplesCodeIssue","thumb-down"],["Altra","otherDown","thumb-down"]],["Ultimo aggiornamento 2022-08-18 UTC."],[],[],null,[]]