对于之前讲过的box-sizing属性，对于页面布局很有用，但是突然发现它依然存在一些问题，前面例子中不会存在问题，不代表它没有问题。如果元素的个数整除100%的时候呢，比较3个元素，那么第一个盒子的宽度就会是33.3333333%,很显然，无论如何都是除不尽的，也就是说不可能平均分配。这显然是.....
分类：
Web程序 时间：
2015-07-17 22:41:27
阅读次数：
216
box-flex：也就是让子容器针对父容器的宽高属性按照一定的规则来划分
Eg：
html代码：
01
02
03
CSS样式：
body,div { background:#fff; margin:0; padding:0;}
.wrap { width:600px; height:200px; color:#fff; margin:20px 0 0 20px; te...
分类：
Web程序 时间：
2015-07-16 11:46:57
阅读次数：
157
原理参考http://www.yyyweb.com/demo/colorful-clock/index.html一个挺漂亮的小时钟，虽然挺简陋的。源代码是自己写。实现起来不怎么难，大家学习学习吧。其中用的css3的flex弹性盒子，个人觉得有了这个弹性盒子之后，水平的布局都简单了，不过flex兼容性...
分类：
Web程序 时间：
2015-06-16 22:32:15
阅读次数：
166
一、box-flex属性（和谐版） 有道桌面词典显示，”flex”一词中文有“收缩”之意。不过，从此属性实际上产生的效果来看，无论怎样用“收缩”一词解释都显得很牵强。所以，这里，直接抛开字面意思，我们可以将”b...
分类：
Web程序 时间：
2015-06-09 14:17:24
阅读次数：
254
display:box;是css3新添加的盒子模型属性，它的出现可以解决我们通过N多结构、css实现的布局方式。经典的一个布局应用就是布局的垂直等高、水平均分、按比例划分。设置父容器样式display:box;.father{ margin: 0 auto; width:...
分类：
Web程序 时间：
2015-06-02 16:55:59
阅读次数：
241
css3引入了新的盒模型——弹性盒模型，该模型决定一个盒子在其他盒子中的分布方式以及如何处理可用的空间。这与XUL（火狐使用的用户交互语言）相似，其它语言也使用相同的盒模型，如XAML 、GladeXML。使用该模型，可以很轻松的创建自适应浏览器窗口的流动布局或自适应字体大小的弹性布局。本文的例子使...
分类：
其他好文 时间：
2015-05-22 17:03:26
阅读次数：
100
一、关于弹性盒模型box是先出来的，flex后出，现在主要用flex。但是box有一个特性是flex没有的，文字可以垂直居中~设了宽度+padding+border记住加：box-sizing: border-box;-webkit-box-sizing:border-box;二、input css...
分类：
其他好文 时间：
2015-05-06 14:53:57
阅读次数：
108
相关资料 ： http://www.w3.org/html/ig/zh/css-flex-1/ CSS 3中弹性盒布局的最新版概述 在CSS 3中，CSS Flexible Box模块为一个非常重要的模块，该模块用于以非常灵活的方式实现页面布局处理。 虽然可...
分类：
Web程序 时间：
2015-05-05 17:03:45
阅读次数：
176
box-flex属性（和谐版）有道桌面词典显示，”flex”一词中文有“收缩”之意。不过，从此属性实际上产生的效果来看，无论怎样用“收缩”一词解释都显得很牵强。所以，这 里，直接抛开字面意思，我们可以将”box-flex”理解为”房子-分配”。box为“盒子”的意思，我们可以理解为当下价格巨高的“房...
分类：
Web程序 时间：
2015-04-29 16:46:18
阅读次数：
237
1. 弹性盒子语法 首先对父元素进行声明： .father{ display:box;} 其次子元素三栏布局,比例1：3：1 ： .son1:{ box-flex:1;} .son2:{ box-flex:3;} .son3:{ box-flex:1;} 如中间固定宽，...
分类：
其他好文 时间：
2015-04-29 07:05:18
阅读次数：
117
