BFC布局规则：内部的Box会在垂直方向，一个接一个地放置。Box垂直方向的距离由margin决定。属于同一个BFC的两个相邻Box的margin会发生重叠每个元素的margin box的左边， 与包含块border box的左边相接触(对于从左往右的格式化，否则相反)。即使存在浮动也是如此。BFC...
分类：
其他好文 时间：
2015-09-12 00:45:58
阅读次数：
190
经常我们设置好了DIV或其他标签的宽度，但是一加边框，宽度就又增加了，尤其是用百分比的时候，宽度控制不好真是麻烦！如下有一解决办法，代码如下，（新属性，兼容性不好，手机端、谷歌、火狐测试可以）1 -webkit-box-sizing: border-box;2 -moz-box-...
分类：
其他好文 时间：
2015-09-11 12:05:11
阅读次数：
126
创建CSS文件如下： 1 @charset "utf-8"; 2 /* CSS Document */ 3 *{ 4 margin:0px; 5 padding:0px; 6 border:0px; 7 } 8 #box{ 9 width:1100px;10 ...
分类：
Web程序 时间：
2015-08-28 17:16:27
阅读次数：
220
题外话:W3C奉行的标准,就是content-box,就是需要计算边框,填充还有内容的;但是就我个人而言,
比较喜欢的是传统IE6时候的怪异模式,不用考虑容器是否会被撑开(打乱布局);盒子模型差异盒子大小计算原理W3C标准盒子 = (边框 + 填充 + 内容块大小) ,牵一发而动全身;
传统IE6盒子 = 整体宽高(边框,填充和边距随盒子大小而调整变化)若是计算占用位置,两中盒子都要算上ma...
分类：
Web程序 时间：
2015-08-19 20:36:29
阅读次数：
308
定义和用法：box-sizing 属性允许您以特定的方式定义匹配某个区域的特定元素。默认值：content-box;继承性：无；css版本：css3语法：box-sizing: content-box | border-box |inherit;属性值说明：content-box默认值;由css2....
分类：
Web程序 时间：
2015-08-14 13:22:45
阅读次数：
108
1、display block块级元素（div、p等） inline 行内元素（a、span等） 常见的例子：把li修改成inline ，制作成水平菜单2、max-width 来适应不同浏览器窗口大小，IE7+都支持这一属性3、box-sizing:border-box 将元素设置这一属性时，元.....
分类：
Web程序 时间：
2015-08-02 07:46:37
阅读次数：
149
效果图等分公式说明：总宽度C,个子div宽度w,个数N,子div间距G思路一floatbox-sizing：border-box; div宽度包含padding宽度； 1 2 3 4 思路二tabl...
分类：
其他好文 时间：
2015-08-02 06:21:23
阅读次数：
117
.inline-block {
display: inline-block;
}
.width33 {
text-align: center;
width: 33%;
box-sizing: border-box;
border-left: 1px solid white;
}
.bottom-bar {
position: fixed;
...
分类：
Web程序 时间：
2015-07-30 14:58:03
阅读次数：
803
第一种：.btn{ /* force height to include the border and padding */ -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; /*...
分类：
其他好文 时间：
2015-07-27 12:32:40
阅读次数：
104
box-sizing,明知故问，看英语，“盒类型”。我去，好吧。就是你想怎么弄这个盒模型。来吧，看看有什么属性值可用： box-sizing: content-box|border-box|inherit;嗯，三个。不错（1）content-box:宽度和高度分别应用到元素的内容框。在宽度和高...
分类：
Web程序 时间：
2015-07-26 00:22:38
阅读次数：
111
