flex布局:两端对齐并自动换行
一个大盒子里,小盒子整齐排列,自动换行。
1 2 3 4 5 6 7 8 | <div class="cont"> <div class="card"></div> <div class="card"></div> <div class="card"></div> <div class="card"></div> <div class="card"></div> <div class="card"></div> </div> |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 | .cont{ display: flex; align-items: center; justify-content: space-between; flex-flow:row wrap; width: 1200px; background-color: #f5f5f5; } .cont .card{ width:385px; height:280px; background:#fff; border:1px solid #E5E5E5; } |