DevTools-tips: hoe u het CSS-raster kunt inspecteren
bookmark_borderbookmark
Stay organized with collections
Save and categorize content based on your preferences.
Sofia Emelianova
Chrome DevTools maakt het opsporen van fouten in CSS-rasterlay-outs intuïtief met een verscheidenheid aan visualisatieopties.
Bekijk de video om te leren hoe u de rasteroverlay in het paneel Elementen kunt schakelen en hoe u deze kunt gebruiken om:
Visualiseer en inspecteer rasterlay-outs.
Zie rij- en kolomnummers waar u naar kunt verwijzen bij het plaatsen van rasteritems.
Gebruik lijn- en vlaknamen en bekijk ze op de overlay als u veel rasteritems heeft en de cijfers verwarrend zijn.
Controleer de spoorgroottes.
Bovendien kunt u met de Rastereditor in het deelvenster Elementen > Stijlen items en hun inhoud uitlijnen in een rasterindeling met één klik op de knop in plaats van CSS-regels te typen.
Voor een meer praktische leerervaring volgt u de Inspect CSS Grid- tutorial.
[[["Easy to understand","easyToUnderstand","thumb-up"],["Solved my problem","solvedMyProblem","thumb-up"],["Other","otherUp","thumb-up"]],[["Missing the information I need","missingTheInformationINeed","thumb-down"],["Too complicated / too many steps","tooComplicatedTooManySteps","thumb-down"],["Out of date","outOfDate","thumb-down"],["Translation issue","translationIssue","thumb-down"],["Samples / code issue","samplesCodeIssue","thumb-down"],["Other","otherDown","thumb-down"]],["Last updated 2022-08-18 UTC."],[],[]]