(1)简单的实现‘比例性’排列

    利用flex属性,可以实现块级元素1:1:1

    移动端弹性布局--flex

    移动端弹性布局--flex

    同理,若将item2里面的flex值改成2,则会出现下面的效果

    移动端弹性布局--flex

 

  (2)简单的就能使里面的内容居中(尤其是垂直居中,好用到爆)

     移动端弹性布局--flex

    移动端弹性布局--flex  

     上面就是用了jsutify-content与align-item2个属性,对应是实现水平居中和垂直居中。

 

  (3)横向排列、竖向排列等(flex-direction:row/column)

     移动端弹性布局--flex

    移动端弹性布局--flex

    

三、flex还有太多魅力,等你来体验

  先声明,上面写的几个属性只是我最近布局常用的,不是全部的flex属性,其实flex好用的属性还有很多很多的,你自己去研究吧。

相关文章: