彈性盒模型:
注意在試用的時候都伪,父元素必須要加 : display:-webkit-box 或 display:-webkit-inline-box;
展示效果如圖:
Box-orient:定義盒模型的布局方向欺旧。
Horizontal:水平方向
vertical:垂直方向。
-webkit-box-orient:vertical; 則垂直顯示懈万。
box-direction 元素排列順序:
normal:正序 ? Reverse :反序默認(rèn)是正序展示,反序展示的效果如圖:
box-ordinal-group 設(shè)置元素的具體位置。
展示效果如圖:
box-flex 定義盒子的彈性空間
子元素的尺寸 = 盒子的尺寸*子元素的box-flex屬性值/所有子元素的box-flex屬性值的和会通。
box-pack 對盒子富裕的空間進(jìn)行管理口予。
star :所有子元素在盒子左側(cè)顯示,富蕴槌蓿空間在右側(cè)
end :所有子元素在盒子右側(cè)顯示沪停,富裕空間在左側(cè)裳涛。
center:所有子元素居中木张。
justify:富裕空間在元素之間平均分配端三。
平均分配的效果代碼:
效果:
在垂直方向上對元素進(jìn)行管理:
box-align:
star:所有子元素在居頂
end:所有子元素居底
center:所有子元素居中窟哺。