弹性盒⼦内容体居右对其_弹性盒⼦：布局⽅案作⽤：控制离它最近的⼀层⼦元素，布局⽅式。
特点：
a：弹性盒⼦⾥⾯的离它最近的⼀层⼦元素都可以添加⼤⼩。
b: 如果想让弹性盒⼦⾥⾯的⼀个⼦元素左右上下居中，只需要给⼦元素添加margin:auto即可
c: 弹性盒⼦⾥⾯的⼦元素都是沿着“主轴”排列
"主轴"：有可能是X轴也有可能是Y轴，如果X轴为主轴，Y轴就是侧轴。
注：默认情况下X轴为主轴。
⼀：触发弹性盒⼦：
display:flex;
⼆：改变主轴的⽅向：
flex-direction:
属性值：
row (默认值：X轴为主轴)
column (Y轴为主轴)
column-reverse (以Y轴为主轴反向排列)
row-reverse (以X轴为主轴反向排列)
三：改变主轴的对齐⽅式：
justify-content:
属性值：
flex-start 默认状态：在弹性盒⼦开始的地⽅显⽰
flex-end 在弹性盒⼦末端对齐
center 居中对齐
space-between 两端对齐
space-around ⾃动分配间距
flex布局对齐方式四：侧轴的对齐⽅式:
align-items:
flex-start 侧轴开始的位置
flex-end 侧轴结束的位置
center 侧轴居中的位置
baseline 基线(flex-start等效)
stretch(默认值) 拉伸
五：控制弹性盒⼦⾥⾯的⼦元素(灵活元素)换⾏处理：
flex-wrap:
wrap 换⾏
nowrap 不换⾏
wrap-reverse 反向换⾏
六：控制⾏与⾏的对齐⽅式：
align-content:
flex-start 默认状态：⾏与⾏之间不存在默认的⾏间距
flex-end 在弹性盒⼦末端对齐
center 居中对齐
space-between 两端对齐
space-around ⾃动分配间距
七：补充：flex-direction 和 flex-wrap简写：
flex-flow:;
注：以上7个属性全部添加在⽗元素弹性盒⼦上⾯！！！！！！！！！！！！！
添加在⼦元素上⾯的属性：
⼀：控制弹性盒⼦⾥⾯ 某个 灵活元素 在侧轴的对齐⽅式。
align-self:
auto 默认值。元素继承了它的⽗容器的 align-items 属性。如果没有⽗容器则为 "stretch"。Stretch元素被拉伸以适应容器。
Center元素位于容器的中⼼。
flex-start元素位于容器的开头。
flex-end元素位于容器的结尾。
⼆：控制⼦元素的排列顺序：
order: 数值越⼤越往后排列。⽀持负数。
三：剩余空间的分配：
flex:1; 分配主轴剩余空间。
flex:1; 简写形式：
flex-grow:; 扩展的量
flex-shrink:; 收缩的量
flex-basis:; 元素的⼤⼩
记住：flex-shrink:0; 不压缩。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。