标签:any ima 弹性布局 左右 color htm div 弹性 examples
关于flex布局,我觉得它在布局里简直就是一匹黑马,不愧为弹性布局
阮一峰大神有一篇博客,讲的超级详细 (http://www.ruanyifeng.com/blog/2015/07/flex-examples.html)地址献上....
下面来举例一下 我平时是什么场合派它上战场
1、左右居中
HTML
<div class="wrapper"> <div class="box"></div> </div>
CSS
.wrapper{ display: flex; justify-content: center; }
2.左右上下居中
CSS
.wrapper{ display: flex; justify-content: center;/*左右*/ align-items: center;/*上下*/ }
3.6项目
HTML
<div class="wrapper"> <div class="item"></div> <div class="item"></div> <div class="item"></div> <div class="item"></div> <div class="item"></div> <div class="item"></div> </div>
CSS
.wrapper{ display: flex; flex-wrap: wrap; }
它还有很多很多的技能,这里我就不一一举例了,写这三个我常用的
Emm 就是这样
标签:any ima 弹性布局 左右 color htm div 弹性 examples
原文地址:https://www.cnblogs.com/khun/p/9486428.html