关于CSS中display:flex与inline-flex属性的详细介绍

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

（推荐学习教程：CSS教程）

flex示例代码

    
    
  


  

    
1
    
2
    
3
    
4
  

效果如下：

display:inline-flex示例代码

如果想看到效果，将上面的display:flex,换成display:inline-flex,并且将width:200px删除。在没有测试之前，有的人可能会认为.main会占据整个一行，但是，测试结果是，它会根据子元素所有的div大小自适应宽度和高度

    
    
  


  

    
1
    
2
    
3
    
4
  

效果如下：

更多编程相关教程，请关注 第一PHP社区 编程入门栏目！

以上就是关于CSS中display:flex与inline-flex属性的详细介绍的详细内容，更多请关注 第一PHP社区 其它相关文章！