flex布局

1，布局：

盒子模型：

　　content-box   

　　普通盒子模型    width = content+padding+border   //box-sizing:content-box;    // 向外扩展

　　其他盒子模型    width = content                //box-sizing:border-box;             // 向内扩展

 

calc  css计算  运算符两边需要空格

 

 

如果父级使用flex属性，子级的float属性失效

 

各类flex属性

 

flex:1   // 系数

 

子元素在划分父元素的宽度时，先刨除固定宽度

 

 

flex-grow:1;          /// 定义子元素的放大比例

 

align-self   /// 用于覆盖父级的align-items

 

order // 用来规定子元素的顺序

 

 

 

 

　　

 

转载于:https://www.cnblogs.com/shmily-code/p/8875171.html