Y]B~4N}L7(}0(LPG1NU_L3.png)
关注迅速公众平台
关注微信联系人
企业电话：
021-64391578
商务联系：
18717819904 林经理
邮件咨询：
1368069293@qq.com
弹性盒布局模型及其应用
引入弹性盒布局模型（flex box）的目的是提供一种更加有效的方式来对一个容器中的条目进行排列、对齐和分配空白空间。即便容器中条目的尺寸未知或是动态变化的,弹性盒布局模型也能正常的工作。
或者说当页面布局必须适应不同的屏幕尺寸和不同的显示设备时,元素可预测地运行。它不使用浮动,flex容器的边缘也不会与其内容的边缘折叠。
我们可以设置使用display: flex;属性,让盒子具有弹性布局的属性。
flex-direction 属性规定灵活项目的方向。 而项目就是容器成员,称为Flex项目（item）,简称”项目”。
flex-direction可以有不同的属性值： row：默认值。
灵活的项目将水平显示,如本例中项目从右到左水平展示。
row-reverse：与 row 相同,但是以相反的顺序。
column：灵活的项目将垂直显示。
column-reverse：与 column 相同,但是以相反的顺序。
initial：设置该属性为它的默认值。
inherit：从父元素继承该属性。
注意：如果元素不是弹性盒对象的元素,则 flex-direction 属性不起作用。
相关推荐
特别申明：本站的主旨在于收集互联网运营相关的干货知识，给运营小伙伴提供便利。 网站所收集到的公开内容均来自于互联网或用户投稿，并不代表本站认同其观点， 也不对网站内容的真实性负责，如有侵权，请联系站长删除
业务联系
迅速服务号
扫码添加微信好友
我们来联系您