flex-wrap | CSS flex-wrap
CSS[1]的flex-wrap属性指定flex元素单行显示还是多行显示。如果允许换行,这个属性允许你控制行的堆叠方向。参考flex布局的基本概念[2]查看更多的属性和信息。flex-wrap:nowrap;flex-wrap:wrap;flex-wrap:wrap-reverse;flex-wrap:inherit;flex-wrap:initial;flex-wrap:revert;flex-wrap:unset;flex-wrap属性可指定为以下取值列表中的任意一个关键字。取值[3]flex-wrap属性接受以下取值:nowrapflex的元素被摆放到到一行,这可能导致flex容器溢出。cross-start会根据flex-direction[4]的值等价于start或before。为该属性的默认值。wrap...
CSS[1] 的 flex-wrap 属性指定 flex 元素单行显示还是多行显示。如果允许换行,这个属性允许你控制行的堆叠方向。
参考 flex 布局的基本概念[2] 查看更多的属性和信息。
flex-wrap: nowrap; flex-wrap: wrap; flex-wrap: wrap-reverse; flex-wrap: inherit; flex-wrap: initial; flex-wrap: revert; flex-wrap: unset;flex-wrap 属性可指定为以下取值列表中的任意一个关键字。
取值[3]flex-wrap 属性接受以下取值:
nowrapflex 的元素被摆放到到一行,这可能导致 flex 容器溢出。cross-start 会根据 flex-direction[4] 的值等价于 start 或 before。为该属性的默认值。
wrapflex 元素 被打断到多个行中。cross-start 会根据 flex-direction[5] 的值等价于 start 或before。cross-end 为确定的 cross-start 的另一端。
wrap-reverse和 wrap 的行为一样,但是 cross-start 和 cross-end 互换。
形式定义[6]形式语法[7]flex-wrap = nowrap |[8]wrap |[9]wrap-reverse 设置 flex 容器堆叠形式[10]HTML <h4>这是一个关于 flex-wrap:wrap 的例子</h4> <div class="content"> <div class="red">1</div> <div class="green">2</div> <div class="blue">3</div> </div> <h4>这是一个关于 flex-wrap:nowrap 的例子</h4&...