您的位置:首页 > Web前端 > CSS

CSS弹性盒模型 box-flex

2016-07-08 15:59 525 查看
目前没有浏览器支持boc-flex属性。

Firefox支持代替的-moz-box-flex属性

Safari、Opera以及Chrome支持替代的-webkit-box-flex属性

box-flex的含义:用来按比例分配父标签的宽度(或高度)控件 box-flex值至少为1时起作用

eg.

<div class="test_box">
<div class="list list_two">1</div>
<div class="list list_one">2</div>
<div class="list list_one">3</div>
</div>


.test_box{
display:-moz-box;
display:-webkit-box;
display:box;
}

.list_one{
-moz-box-flex:1;
-webkit-box-flex:1;
box-flex:1;
}

.list_two{
-moz-box-flex:2;
-webkit-box-flex:2;
box-flex:2;
}

.list{
border: solid 1px black;
}


显示结果:

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: