So steuern Sie den Elementumbruch in CSS Flexbox
Frage:
Gibt es eine Möglichkeit ein Element angeben, nach dem der Umbruch in einem Flexbox-Layout erfolgen soll? Dies wäre nützlich, um die Reaktionsfähigkeit einer Liste zu steuern, ohne zusätzliches Markup hinzuzufügen.
Antwort:
Es gibt zwar keine explizite „Flex-Break“-Eigenschaft Mit dem Flexbox-Standard können Sie diesen Effekt durch die Kombination der folgenden Techniken erzielen:
Beispiel:
<code class="css">ul { display: flex; flex-wrap: wrap; } li:nth-child(2n) { flex-basis: 100%; }</code>
In diesem Beispiel werden Elemente in der Liste nach jedem zweiten Element in eine neue Zeile umgebrochen (abhängig vom verfügbaren Platz). Durch Anpassen des Werts von „nth-child()“ können Sie steuern, welche Elemente den Umbruch verursachen.
Eine ausführlichere Demonstration finden Sie in der bereitgestellten JSFiddle: http://jsfiddle.net/theazureshadow/ww8DR /
Das obige ist der detaillierte Inhalt vonSo steuern Sie den Elementumbruch in CSS Flexbox: Kann ich den Zeilenumbruch von Flexbox nach einem bestimmten Element erzwingen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!