flex第一篇

原创 大喵 随笔 HTML+CSS 192阅读 2018-02-26 11:57:56 举报

1、如何使用flex自适应
解决方案:父容器使用display:flex属性,则子容器会平分父容器内的空间
2、如何使flex布局拥有float:left/right效果
解决方案:flex-wrap属性(设置子内容换行)
wrap效果类似于float:left
类似float:right还需要flex-direction:row-reverse属性(改变主轴方向)
3、注意:float、clear属性和vertical-align属性在flex属性中无效。
4、在设置商品框的时候,商品框可以自适应,但是在页面变小时,商品框无法根据页面从4个变为3个、2个、1个
解决方案:将子元素设定的25%的宽度去除。
5、布局页面时希望导航能一直浮在上放,使用postion:fixed与flex冲突,flex样式全部变为无效。
解决方案:将导航提出,单独使用样式,不用flex控制

评论 ( 3 )
最新评论
lawrence 2F 2018-03-01 23:13:30 3F

大喵原来是个妹纸啊

大喵 1F 2018-03-01 22:57:13 2F

重不重要我不太清楚,这个还属于css3的新技术,性能可能不是很好,但是有一点需要肯定是用它来布局真的很方便

lawrence 2018-02-27 13:27:04 1F

flex布局有这么重要么?