flex布局，骰子图案

m0107***

请大家帮我分析一下四图案的实现过程，为什么要分成两个类来写
（box类和column类）？flex-basis:100%又是什么意思？可以理解为height:100% ；width:100%吗？
而六图案就不用分成两个类，比四图案实现简单了。是不是因为六图案第一行堆满了，所以设置了flex-wrap:wrap就自动换行了？

Weic***

至于六图案不用分类是因为每一行只能放置3个点，6个刚好堆满两行，所以只要交叉轴上下对齐就可以啦（不需要像四图案一样还要两端对齐）

m2073***

flex-basis:100%是占用主轴空间的100%，在这里可以理解为占用宽度为100%。box类是整个的大盒子，里面有2个column类，每个column类在这里就是一行（因为宽度100%），根据align-content：space-between后，这两行就上下对齐了，然后
.column{display:flex;
flex-direction:column;
justify-content:space-between;
} 每一行里的两个筛点两端对齐、

bqh***

不好意思啊。其实这个我也不是很了解（捂脸）。然后，我去找了下源代码
.box6{display:flex;flex-warp:wrap;align-content:space-between;}.box6.column{display:flex;flex-direction:column;justify-content:space-between;}flex-direction主轴为垂直方向，起点在上沿。也就是三列。

时代威客APP

时代威客公众号

时代威客小程序

猜你需要

热门需求

flex布局，骰子图案

参与会员3

可能感兴趣的问答

浏览过的版块

最新任务

最新问答

优

快

专

保

新手帮助

平台规则

关于时代

便捷服务

微信小程序

新浪微博

手机客户端