CSS-Grid-Generator
Fehler: Ergebnisse außerhalb des beschriebenen Umfangs verwenden.
Lösung: Erstellen Sie ein CSS Grid mit gleichen Spalten und passen Sie den Code an.
Archiv · Kostenlos
CSS-Grid-Generator
Erzeuge eine Rastervorschau und CSS aus Spalten, Zeilen und Abständen.
Dieses Tool ist archiviert. Prüfen Sie Methode und datierte Daten vor der Nutzung erneut.
01Werte eingeben
Läuft im BrowserFunktioniert offline im Browser. Sobald die Seite und die benötigten Dateien geladen sind, ist für die Verarbeitung kein Internet nötig.
02CSS-Grid-Generator
Läuft im Browser
So funktioniert es
Erzeuge eine Rastervorschau und CSS aus Spalten, Zeilen und Abständen.
Läuft im Browser
Deine Daten bleiben bei dir
Eingaben werden auf dieser Seite verarbeitet und nicht an einen Server gesendet.
Über dieses Tool
Tool verwenden ↑Erzeuge eine Rastervorschau und CSS aus Spalten, Zeilen und Abständen.
Erstellen Sie ein CSS Grid mit gleichen Spalten und passen Sie den Code an.
- Werte eingeben
- Spalten
- Zeilen
- Abstand
- Berechnungsmethode
Erzeuge eine Rastervorschau und CSS aus Spalten, Zeilen und Abständen.
- Beispiel · Ergebnis
display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: repeat(2, minmax(80px, auto)); gap: 16px;
Berechnungsmethode
- Erstellen Sie ein CSS Grid mit gleichen Spalten und passen Sie den Code an.
CSS-Grid-Generator
- Spalten
- 3
- Zeilen
- 2
- Abstand
- 16 px
Ergebnis
display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: repeat(2, minmax(80px, auto)); gap: 16px;
Häufige Fragen
Wie ist das Ergebnis zu verstehen?
Erstellen Sie ein CSS Grid mit gleichen Spalten und passen Sie den Code an.
Wohin gehen meine Daten?
Die Berechnungen laufen auf Ihrem Gerät. Eingaben werden nicht an einen Server gesendet.
Begriffe und Erläuterungen
Werte eingeben
- Spalten
Erstellen Sie ein CSS Grid mit gleichen Spalten und passen Sie den Code an.
Geben Sie eine ganze Zahl ein, keine Bruchteile.
Minimum: 1 · Maximum: 12
- Zeilen
Geben Sie eine ganze Zahl ein, keine Bruchteile.
Minimum: 1 · Maximum: 12
- Abstand
Geben Sie den Zahlenwert dieser Größe ein. Verwenden Sie die neben dem Feld angezeigte Einheit. px
Minimum: 0 · Maximum: 100 px
Ergebnis
- Ergebnis
Erstellen Sie ein CSS Grid mit gleichen Spalten und passen Sie den Code an.
Aus Ihren Eingaben nach der folgenden Methode berechnet.
Häufige Fehler und Lösungen
Grenzen und Annahmen
- Erstellen Sie ein CSS Grid mit gleichen Spalten und passen Sie den Code an.
- Angezeigte Werte können gerundet sein; das erhöht die Messgenauigkeit nicht.