flex布局方法详解之flex-wrap

首先声明,本文参考了阮一峰老师的博客,原文地址:http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html

本文结合微信小程序 来对flex布局做一个说明,用到了view组件,其实你只需要把view看成DIV就行了。

问题2:假如一个flex盒子里面有N多个view,会咋样?




呀呀呀,这可咋整,咋不换行呢?

尊敬的各位领导,各位同学,女士们,先生们。接下来,我们要介绍一位重量级的嘉宾。
为了解决flex盒子中子元素过多而换不了行的问题,这位嘉宾可是做出了卓越的贡献,他就是 -- flex-wrap !

它可能取三个值。
(1)nowrap(默认):不换行。

刚刚的那种情况就是 flex-wrap: nowrap 的情况。

(2)wrap:换行,第一行在上方。




(3)wrap-reverse:换行,第一行在下方。


最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容