CSS Grid Layout er et W3C-utkast som definerer et kraftig gridsystem for å gjøre det enklere å legge ut dine nettsider ved hjelp av CSS.
I vårt nye kurs, 3 CSS Grid Projects for Web Designers, vil du bygge tre prosjekter for å hjelpe deg med å forstå hva som kommer til å bli mulig med "Grid".
Med omfattende veiledning fra Envato Tuts + instruktør Craig Campbell, jobber du gjennom tre prosjekter for å hjelpe deg med å mestre CSS Grid-oppsettet.
Den første er nybegynnernivå og vil introdusere deg til Grid-konsepter. Den andre tar ting opp på et nivå, undersøker ting som justering og nesting. Det endelige prosjektet er mer avansert, bruker Flexbox i kombinasjon med Grid. Å følge disse tre prosjektene gjennom til ferdigstillelse vil jevnlig ta deg fra Grid nybegynner til trygg Grid bruker.
Her er noen gratis leksjoner fra dette kurset, som en forhåndsvisning av hva du kan forvente:
Lær hvordan du lager en enkel Grid-oppsett med CSS. Vi skal definere våre gridområder ved hjelp av gitter-kolonne
og gitter-rad
eiendommer.
Relaterte linker
Noen ganger kan det hende du trenger en rutenett i et annet rutenett system. I denne videoen fra det andre prosjektet vil du opprette nestede grids ved hjelp av CSS Grid Layout-modulen.
Relaterte linker
I det tredje prosjektet blir tingene mer avanserte. I denne videoen fra den siste delen av kurset legger du ut hovedgitteret for dette prosjektet.
Relaterte linker
Du kan ta vårt nye kurs med en gang med et abonnement på Envato Elements. For en enkelt månedlig avgift får du tilgang ikke bare til dette kurset, men også til vårt voksende bibliotek med over 1000 videokurser og bransjeledende e-bøker på Envato Tuts+.
I tillegg får du ubegrensede nedlastinger fra det store Envato Elements-biblioteket med 200.000 + bilder og 26.000 + designmateriell og maler. Lag med unike skrifttyper, bilder, grafikk og maler, og lever bedre bedre prosjekter raskere.
Vil du fortsatt lære mer? Vi har bygget en omfattende veiledning for å hjelpe deg med å lære CSS online, enten du bare har begynt med det grunnleggende eller du vil utforske mer avansert CSS. Sjekk ut Lær CSS: The Complete Guide.