CSS-Grid-Generator
Tracks und benannte Bereiche mit lokaler Grid-Vorschau und HTML/CSS erstellen.
- Läuft im Browser
- Kein Upload
- Vor dem Download prüfen
Eingaben bleiben in diesem Tab und werden weder hochgeladen noch automatisch gespeichert. Optionale aggregierte Nutzungszahlen und grobe Verarbeitungsdiagnosen werden nur nach Einwilligung gesendet, ohne Eingabeinhalte oder Dateinamen. Leeren oder Schließen verwirft Eingaben; benötigte Ergebnisse vorher speichern.
Ressourcenlimits
Grid: fr0.01–100 / px0–2000 / %0–100 / auto; [a-z][a-z0-9_-]{0,19}. 1–8 Tracks pro Achse (fr/px/%/auto), Abstand 0–100px, bis 64 Zellen. Jeder benannte Bereich muss ein Rechteck bilden. Ein Punkt ist eine leere Zelle. Vorschau und Export verwenden dieselben Elemente. Begrenzte lokale Vorschau, keine universelle Browser-/Layoutgarantie. Eingaben werden nicht ausgeführt. HTML und CSS zusammen herunterladen. Zeitlimit: 8 Sekunden.
So geht’s
- Beispiel konfigurieren
Füge Spalten und Zeilen hinzu und wähle Trackeinheit, Größe und Abstand. Trage rechteckig wiederholte Bereichsnamen oder Punkte ein. Erzeuge und prüfe die Positionen, bevor du HTML und CSS exportierst.
- Vor Verwendung prüfen
Eingaben bleiben in diesem Tab und werden weder hochgeladen noch automatisch gespeichert. Optionale aggregierte Nutzungszahlen und grobe Verarbeitungsdiagnosen werden nur nach Einwilligung gesendet, ohne Eingabeinhalte oder Dateinamen. Leeren oder Schließen verwirft Eingaben; benötigte Ergebnisse vorher speichern. Grid: fr0.01–100 / px0–2000 / %0–100 / auto; [a-z][a-z0-9_-]{0,19}. 1–8 Tracks pro Achse (fr/px/%/auto), Abstand 0–100px, bis 64 Zellen. Jeder benannte Bereich muss ein Rechteck bilden. Ein Punkt ist eine leere Zelle. Vorschau und Export verwenden dieselben Elemente. Begrenzte lokale Vorschau, keine universelle Browser-/Layoutgarantie. Eingaben werden nicht ausgeführt. HTML und CSS zusammen herunterladen. Zeitlimit: 8 Sekunden.
- Geprüftes Ergebnis exportieren
Ergebnis herunterladen; Original herunterladen
Fragen und Grenzen
Ressourcenlimits
Grid: fr0.01–100 / px0–2000 / %0–100 / auto; [a-z][a-z0-9_-]{0,19}. 1–8 Tracks pro Achse (fr/px/%/auto), Abstand 0–100px, bis 64 Zellen. Jeder benannte Bereich muss ein Rechteck bilden. Ein Punkt ist eine leere Zelle. Vorschau und Export verwenden dieselben Elemente. Begrenzte lokale Vorschau, keine universelle Browser-/Layoutgarantie. Eingaben werden nicht ausgeführt. HTML und CSS zusammen herunterladen. Zeitlimit: 8 Sekunden.
Offline-Design
Eingaben bleiben in diesem Tab und werden weder hochgeladen noch automatisch gespeichert. Optionale aggregierte Nutzungszahlen und grobe Verarbeitungsdiagnosen werden nur nach Einwilligung gesendet, ohne Eingabeinhalte oder Dateinamen. Leeren oder Schließen verwirft Eingaben; benötigte Ergebnisse vorher speichern.
Vor Verwendung prüfen
Füge Spalten und Zeilen hinzu und wähle Trackeinheit, Größe und Abstand. Trage rechteckig wiederholte Bereichsnamen oder Punkte ein. Erzeuge und prüfe die Positionen, bevor du HTML und CSS exportierst.