Det føles som om CSS Grid har været i lang tid nu, men det ser lige ud til at nå et punkt, hvor folk taler mere og mere om det, og at det bliver noget, vi bør lære. Jeg begyndte at læse et par indlæg og lege rundt med syntaksen de sidste par uger, men bad min kollega CSS-Trickster Miriam Suzanne om at grok igennem det med mig på et video-hangout.
Vi brugte vores tid på at kigge på det grundlæggende i CSS Grid, og det vi lærte er, at det er meget mindre skræmmende at begynde at bruge det, end nogen af os forventede. Vi starter med et simpelt eksempel og nudler os derefter gennem CSS Grid-egenskaberne for at lære, hvilke andre ting det er i stand til at håndtere uden at komme for langt i ukrudtet.
Her er et par ressourcer, vi nævnte under vores chat, der er værd at linke til:
- En komplet guide til gitter - En omfattende oversigt over CSS Grid, herunder dens egenskaber og en ordliste over vigtige udtryk og koncepter.
- CodePen Demo - Dette er det enkle eksempel, som vi startede med i videoen og avancerede, da vi gik.
- CSS Grid and Grid Highlighter - Dette værktøj blev nævnt mod slutningen, og det giver en måde at visualisere gitterlayoutet ved hjælp af Firefox DevTools.