qq_42524153的博客

align-self ：        控制子项自己在侧轴上的排列方式，用来给单个子元素设置，会覆盖掉父元素的align-items属性设置。属性值：flex-start（默认）、flex-end、center、eg:       &nbsp...

flex 用来定义子元素分配父元素的剩余空间，用flex来表示占多少份用法：      flex：具体数字；（默认是0）       例如 flex：1； 表示该子元素占用其父元素剩余空间的一份。      通...

flex布局中如何让子元素水平垂直居中思路：先让子元素在主轴上居中对齐：justify-content: center;再让子元素在侧轴上居中对齐：align-items: center;（单行） 或者 align-content: center;（多行）注意：不要忘了给父元素添加display：flex；，这是开启 flex 布局的钥匙举例说明：单行子元素实现水平垂直居中：...

flex-flowflex-flow 是 flex-direction 和 flex-wrap 的简写形式 flex-direction: column; /*以列为主轴*/ flex-wrap: wrap; /*换行*/上面两行代码可以简写为： flex-flow: column wrap;...

align-items 和 align-content的区别      虽然两者都表示设置子元素在侧轴上的排列方式，但：      align-items 应用于子元素没有换行（父元素代码中没有flex-wrap：wrap；）的情况下   &n...

align-contentalign-content：设置多行子元素在侧轴上（默认侧轴为y轴）的排列方式注意：该属性只对父元素中有换行情况的子元素有效，即父元素代码中有“ flex-wrap：wrap；”，才会对子元素有效align-content的属性值：属性值含义flex-start子元素在侧轴的头部开始排列 （默认值）flex-end子元素在侧轴的尾部开...

align-itemsalign-items ：设置子元素在侧轴上（默认侧轴为y轴）的排列方式align-items的属性值：属性值含义flex-start子元素贴着侧轴的头部排列（默认值）flex-end子元素贴着侧轴的尾部排列center子元素在侧轴上居中对齐stretch拉伸，使得子元素在侧轴方向上与父元素等大具体实例（以侧轴为...

flex-wrapflex-wrap ：是否允许子元素换行。flex-wrap的属性值：属性值含义nowrap不换行 （默认值）wrap换行解释说明：        默认值为nowrap，不换行，当父元素在主轴上一行（一列）装不下子元素时，将会对子元素进行等比缩放，使子元素能在主轴上一...

父元素属性之 justify-content          justify-content：设置主轴上子元素的排列方式justify-content 的属性值如下：属性值含义flex-start从主轴的头部开始排，主轴：x轴 左对齐；y轴 顶部对齐（默 认值）f...

flex布局      flex : flexible box的缩写，意为“弹性布局”，用来为盒状模型提供最大的灵活性，任何一个容器都可以指定为flex布局。      flex布局原理：通过给父元素添加flex属性(display：flex；)，来控制子元素的位置和排列方式...