如何控制 CSS Flexbox 中的元素換行：我可以強迫 Flexbox 在特定元素之後換行嗎？

如何控制CSS Flexbox 中的元素換行

問題：

問題：

有辦法指定嗎一個元素，在Flexbox 佈局中應在該元素之後進行換行？這對於控制清單的回應能力而不添加額外的標記非常有用。

答案：

1. 雖然沒有明確的「flex-break」屬性根據flexbox標準，可以透過結合以下技巧來實現這種效果：
2. 設定「flex-wrap:wrap;」在容器上： 這允許項目根據需要換行。

使用「flex-basis: 100%;」在要在其後中斷的子元素上： 這告訴瀏覽器將這些元素的最小寬度設為100%，有效地強制它們換行。

<code class="css">ul {
  display: flex;
  flex-wrap: wrap;
}

li:nth-child(2n) {
  flex-basis: 100%;
}</code>

範例：

在此範例中，清單中的項目將在每個其他元素之後換行到新行（取決於可用空間）。透過調整「nth-child()」的值，您可以控制哪些元素導致換行。 更完整的演示，請參閱提供的 JSFiddle：http://jsfiddle.net/theazureshadow/ww8DR /

以上是如何控制 CSS Flexbox 中的元素換行：我可以強迫 Flexbox 在特定元素之後換行嗎？的詳細內容。更多資訊請關注PHP中文網其他相關文章！