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.
显示结果:
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; }
显示结果:
相关文章推荐
- 层层叠叠,用好z-index
- CSS3 transform介绍|如何设计炫酷的动画效果
- span 的用法
- html里嵌入CSS的三种方式
- CSS---Tips1文本样式
- css3里面的-webkit-transition
- CSS让脚部始终在页面底部
- css的hack
- CSS3 涟漪效果
- Css3 - Animation Examples
- CSS3中的transform变形
- 用css写出一个小三角形图标
- 一个简单的TabItem样式。
- css3中边框的4种样式
- 欢迎使用CSDN-markdown编辑器
- HTML&CSS基础学习笔记1.9-添加图片
- HTML/CSS 快速编写必备 - emmet插件
- 改变 input file 样式的两种方法
- CSS:span元素margin-top无效的根源
- CSS教程:div垂直居中的N种方法[转]