CSS Grid-generator
Fel: Använda resultat utanför beskrivet tillämpningsområde.
Lösning: Skapa CSS Grid med lika kolumner och anpassa koden till din sida.
Arkiv · Gratis
CSS Grid-generator
Skapa en rutnätsförhandsvisning och CSS från kolumner, rader och mellanrum.
Det här verktyget är arkiverat. Kontrollera metod och daterade uppgifter igen före användning.
01Ange värden
Körs i webbläsarenFungerar offline i webbläsaren. När sidan och nödvändiga filer har laddats behövs inget internet för bearbetningen.
02CSS Grid-generator
Körs i webbläsaren
Så fungerar det
Skapa en rutnätsförhandsvisning och CSS från kolumner, rader och mellanrum.
Körs i webbläsaren
Dina data stannar hos dig
Inmatningen behandlas på den här sidan och skickas inte till en server.
Om verktyget
Använd verktyget ↑Skapa en rutnätsförhandsvisning och CSS från kolumner, rader och mellanrum.
Skapa CSS Grid med lika kolumner och anpassa koden till din sida.
- Ange värden
- Kolumner
- Rader
- Mellanrum
- Beräkningsmetod
Skapa en rutnätsförhandsvisning och CSS från kolumner, rader och mellanrum.
- Exempel · Resultat
display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: repeat(2, minmax(80px, auto)); gap: 16px;
Beräkningsmetod
- Skapa CSS Grid med lika kolumner och anpassa koden till din sida.
CSS Grid-generator
- Kolumner
- 3
- Rader
- 2
- Mellanrum
- 16 px
Resultat
display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: repeat(2, minmax(80px, auto)); gap: 16px;
Vanliga frågor
Hur ska resultatet tolkas?
Skapa CSS Grid med lika kolumner och anpassa koden till din sida.
Vart går mina uppgifter?
Beräkningarna körs på din enhet. Indata skickas inte till en server.
Termer och förklaringar
Ange värden
- Kolumner
Skapa CSS Grid med lika kolumner och anpassa koden till din sida.
Ange ett heltal, inte delar av ett antal.
Minimum: 1 · Maximum: 12
- Rader
Ange ett heltal, inte delar av ett antal.
Minimum: 1 · Maximum: 12
- Mellanrum
Ange storhetens numeriska värde. Använd enheten som visas vid fältet. px
Minimum: 0 · Maximum: 100 px
Resultat
- Resultat
Skapa CSS Grid med lika kolumner och anpassa koden till din sida.
Beräknas från dina indata med metoden nedan.
Vanliga fel och lösningar
Begränsningar och antaganden
- Skapa CSS Grid med lika kolumner och anpassa koden till din sida.
- Resultat kan avrundas; det ökar inte mätningens noggrannhet.