Om CSS Grid från WordCamp 17 juni 2017

Vad är CSS Grid? Hur använder man det? Vilka fördelar får vi med CSS Grid? Morten Rand-Hendriksen höll ett föredrag om CSS Grid på WordCamp i Paris den 17/6-2017.

“CSS Grid stöds nu av alla större webbläsare och allt vi vet om webbdesign kommer att förändras! Tänk dig att du kan rita ett rutnät i webbläsaren och placera innehåll i ett eller ett antal celler utan att behöva ändra HTML- eller källordningen. Föreställ dig sedan att du kan ändra det rutnätet med hjälp av media queries eller JavaScript, samtidigt som din HTML är ren och tillgänglig. Det är vad CSS Grid gör, och det är därför du borde använda det idag.

CSS Grid Layout Module introducerar ett inbyggt CSS-gridsystem, tillhandahållen på viewport nivå, och som åstadkommer vad nuvarande CSS ramverk och populära nätverkssystem bara kan drömma om: Responsiva, flexibla, rena CSS-gridlayouter, oberoende av dokumentkälla, som tillåter oss att använda webbläsaren som en riktig design och layout yta.

I den här genomgången får du en introduktion till CSS Grid och lära dig hur det förändrar ganska mycket av allt när det gäller layouter på webben. Genom exempelvis kodsnuttar och praktiska demos kommer du att få lära dig hur du använder CSS Grid i ett tema för moderna responsiva layouter, och du lär dig också att hantera äldre webbläsare utan Grid-stöd på ett rent och framåtriktat sätt.

CSS Grid är här, och du kan börja använda det idag. Den här informationen visar hur du gör det på rätt sätt.

-Morten Rand-Hendriksen

[källa: WordCamp Europe, June 17th, 2017. Redigerat och fritt översatt av mig.]

Fler länkar om CSS Grids

Författare: Lena

Lena är en riktig web geek med sikte mot web standards. Hon har både fått utmärkelsen Årets WebQueen som att ha blivit omskriven för sina insatser på nätet. Hennes stora intresse är gränssnitt. Lena är gränssnitt- front end designer och har studerat design, gränssnitt, tillgänglighet, användbarhet och web standards på Blekinge Tekniska Högskola.

Kommentera

E-postadressen publiceras inte. Obligatoriska fält är märkta *