首页 > 其他 > 详细

flex布局

时间:2021-01-26 12:41:04      阅读:31      评论:0      收藏:0      [点我收藏+]

 

flex

  两端对齐,列不满左对齐

  利用after或者before(适用于每行3或者4列)

.box:after {
    display:block;
    content:"";
    width: 30%;
    height:0px;
}
全部代码
.box { display: flex; flex
-wrap: wrap; justify-content: space-between; } .item { width: 30%; height: 50px; background-color: #f1f8ff; margin-bottom: 10px; } .placeholder { width: 30%; height: 0px; } <div class="box"> <div class="item"></div> <div class="item"></div> <div class="item"></div> <div class="item"></div> <div class="item"></div> <div class="placeholder"></div> </div>

 

flex布局

原文:https://www.cnblogs.com/wencaiguagua/p/14329553.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!