|
如今Flex布局不管是移动端还是PC端的应用已经非常广泛了，下面我列举几个平时项目中非常常见的几个需求。以下例子我们都以Vue项目为例
flex布局均匀分布后换行问题需求一：ul下有多个li，每三个li排一列，多余的换行显示。 很显然，绝大部分的小伙伴都会使用Flex布局，很显然会出现一个问题就是如果li是3的倍数的话就能正常显示，若不是的话，布局就不是产品经理满意的结果。 display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; 图片：1.jpg  解决方案： 我们在ul的底部新增li，个数为数组总长度%3的余数即可。 <li class="item" style="border: none;" v-for="(ite, idx) in list.length%3" :key="idx"></li> 图片：2.jpg 参考：https://juejin.im/post/5e8153bf6fb9a03c840d509d |
|
|
公众号
