[操作系统：Windows]
先看代码：
/g,''); delpost.runcode11 .value = ffcod;</script> 提示：您可以先修改部分代码再运行
关键部分：
html { -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; padding:100px 0; overflow:hidden;}
原理大概就是这样的：
千言万语抵不过一副画，通过整容前后的对比，大家应该能看出box-sizing:border-box的作用了。
了解box-sizing的同学们应该知道，它来自离微国比较遥远的css3世界，因此IE6/IE7是不支持的，但我很负责任滴说：本demo正常兼容IE6/IE7。
因为……
IE6/IE7下，<html>的box-sizing默认值本就是border-box（注：IE7有一点点不正常，overflow:hidden后神志有所恢复，将不影响本demo正常运作）。、
现在的问题就是是不是要采用这个方法了，给点优劣的对比，大家自行斟酌吧：
比较使用绝对定位的方法来实现，这个方法在目前主要存在两个优势：
- 针对每种浏览器基本使用的同一方法，css代码简单，易修改、易理解。
- 兼容。绝对定位的方法在OP10下存在暂时找不着修复bug的办法，只好绕个弯走了。
它最大的劣势就是欠灵活，如果没有IE6，我想我是坚决选择绝对定位的方法的。
以下为应用实例demo。
/g,''); delpost.runcode12 .value = ffcod;</script> 提示：您可以先修改部分代码再运行
一个应注意的问题：
不要给body以overflow:hidden，它将会无情地隐藏掉任何在它以外的任何东西，包括top/bottom（header/footer）；
一个应理解的要点：
[100%+(N)px] 的高度产生的方法：div { height:100%; padding-top:(N)px;}。
到此这篇关于CSS网页实例 如何利用box-sizing如何实现div仿框架结构如何实现代码就介绍到这了。有些话，适合烂在心里，有些痛苦，适合无声无息地忘记。当经历过，你成长了，自己知道就好。很多改变，不需要你自己说，别人会看得到。更多相关CSS网页实例 如何利用box-sizing如何实现div仿框架结构如何实现代码内容请查看相关栏目，小编编辑不易，再次感谢大家的支持！
