【详解CSS3盒模型display:box】二
来源:互联网 发布:linux 安装rpm命令 编辑:程序博客网 时间:2024/05/16 14:11
【详解CSS3盒模型display:box】二
box属性上面”css3弹性盒子模型之box-flex”将box-flex如何对父容器的宽度进行划分分配讲解完毕,下面在看一下父容器里面的box属性包括哪些box属性,具体属性如下代码所示:box-orient | box-direction | box-align | box-pack | box-lines1、box-orientbox-orient(orient译为排列更准确)用来确定父容器里子容器的排列方式,是水平还是垂直。可选属性如下所示:horizontal | vertical | inline-axis | block-axis | inherithorizontal、inline-axis说明:给box设置horizontal或inline-axis属性其效果似乎表现一致,都可将子容器水平排列,具体两者有什么实质差别暂时还没有搞清楚。如果父容器选择horizontal或inline-axis属性对子容器进行水平排列,其是对父容器的宽度进行分配划分此时如果父容器定义了高度值,其子容器的高度值设置则无效状态,所有子容器的高度等于父容器的高度值;如果父容器不设置高度值,其子容器的高度值才有效并且取最大高度值的子容器的高度。CSS代码:.wrap{width:600px;height:200px;display:-moz-box;display:-webkit-box;display:box;-moz-box-orient:horizontal;-webkit-box-orient:horizontal;box-orient:horizontal;//水平排列}.sectionOne{background:orange;-moz-box-flex:1;-webkit-box-flex:1;box-flex:1;}.sectionTwo{background:purple;-moz-box-flex:2;-webkit-box-flex:2;box-flex:2;}.sectionThree{width:100px;background:green;}
- 【详解CSS3盒模型display:box】二
- CSS3盒模型display:box详解
- CSS3盒模型display:box详解
- CSS3盒模型display:box详解
- CSS3盒模型display:box详解
- 【详解CSS3盒模型display:box】
- 【CSS3盒模型display:box的应用】
- CSS3 display:box详解
- CSS3 display:box;和 box-flex详解
- CSS3.0盒模型display:-webkit-box;的使用
- CSS3.0盒模型display:-webkit-box;的使用
- CSS3.0盒模型display:-webkit-box;的使用
- CSS3.0盒模型display:-webkit-box;的使用
- 【转载】CSS3.0盒模型display:-webkit-box;的使用
- CSS3.0盒模型display:-webkit-box;的使用
- CSS3.0盒模型display:-webkit-box;的使用
- CSS3.0盒模型display:-webkit-box;的使用
- 盒模型display:-webkit-box;
- Android 内存优化总结&实践
- E
- 【详解CSS3盒模型display:box】
- Android 自定义toast总结:纯文本,带图像,带标题栏及自定义背景文字颜色
- caffe层解读系列-softmax_loss
- 【详解CSS3盒模型display:box】二
- Arduino第一个程序详解——人人都能玩硬件
- [容器]Pull下kubeadm1.6所需的镜像
- docker部署web应用
- shape的使用创建步骤文件要放在drawable文件夹下如果放在layout下会报错
- Android6.0 Disk I/O error
- oc——与c之不同——文件包含 默认初始化
- Java定时更新数据---定时器(spring+struts2)
- 1002. A+B for Polynomials (25)