CSS-Flexbox-Playground
Erkunde Ausrichtung, Umbruch und Abstände visuell.
So verwendest du CSS-Flexbox-Playground
- Gib die angeforderten Werte im Einstellungsbereich ein.
- Passe die Grundeinstellungen an und öffne dann den Erweiterten Modus für Export- und Feinabstimmungsoptionen. Benutzerdefinierte Einstellungen bleiben aktiv, wenn das Panel geschlossen wird.
- Führe den CSS-Flexbox-Playground aus, prüfe die Ausgabe und verwende dann die verfügbaren Bedienelemente zum Kopieren oder Herunterladen.
Was dieses Tool unterstützt
Erkunde Ausrichtung, Umbruch und Abstände visuell.
- Richtung
- row · column · row-reverse · column-reverse
- Inhalt verteilen (justify-content)
- flex-start · center · flex-end · space-between · space-around · space-evenly
- Elemente ausrichten (align-items)
- stretch · flex-start · center · flex-end
- Umbruch
- wrap · nowrap
- Abstand (px)
- Range: 0 to 100
- Elemente
- Range: 1 to 30
Grenzen und Verarbeitung
Bilder unterliegen der bestehenden Canvas-Grenze von 32 Megapixeln. Wo unterstützt, sind bis zu 100 Quellbilder zulässig. Eingefügtes HTML ist auf 200.000 Zeichen begrenzt; Mermaid-Diagramme auf 20.000 Zeichen und 300 Zeilen. Die SVG- und PNG-Erzeugung erfordert einen Browser.
Häufige Fragen
Was macht der CSS-Flexbox-Playground?
Erkunde Ausrichtung, Umbruch und Abstände visuell.
Wo wird meine Eingabe verarbeitet?
Dieser Vorgang verarbeitet seine Quelle in deinem Browser. Kopieren und Herunterladen sind ausdrückliche Aktionen; die Quelleingabe wird nicht in einem Konto oder Verlauf gespeichert.
Welche Eingabelimits gelten?
Bilder unterliegen der bestehenden Canvas-Grenze von 32 Megapixeln. Wo unterstützt, sind bis zu 100 Quellbilder zulässig. Eingefügtes HTML ist auf 200.000 Zeichen begrenzt; Mermaid-Diagramme auf 20.000 Zeichen und 300 Zeilen. Die SVG- und PNG-Erzeugung erfordert einen Browser.