【CSS】flex与inline-flex的区别

flex与inline-flex的区别

flex： 将对象作为弹性伸缩盒显示
inline-flex：将对象作为内联块级弹性伸缩盒显示 

flex

.main{
      background-color: #0f0;
      display: flex;/*父div设置该属性*/
    }               
    .main>div{
      width: 50px;
      height: 50px;
      border: 1px solid black;
    }

结果： 

 

会独占一行，拥有块级要素的属性

inline-flex