-
必须给父容器div定义css属性display:box,其子容器才可以进行划分(如果定了display:box则该容器定义为内联元素,使用margin让其居中是无效的,可以在其父元素设置text-align:center让其居中);
-
子元素属性:box-flex:比例值;
-
目前box-flex属性还没有得到firefox、Opera、chrome浏览器的完全支持,但可以使用它们的私有属性定义firefox(-moz-)、opera(-o-)、chrome/safari(-webkit-)。
-
注:如果子元素设置了固定宽度和margin,则该子元素直接应用宽度值,其它没有设置的则在父容器的宽度基础上减去子容器设置的固定宽度和margin值,在剩下的宽度基础上按一定比例进行划分分配。
-
代码块:
<div>
<p id="p1">web</p>
<p id="p2">css</p>
</div>
对子元素进行设置
效果
获取更多的文章,欢迎关注微信公众号