写前端的人知道,一个块规定了宽和高再设定这个块的边框,此时这个块的宽和高需加上这个边框的值。CSS3解决了这个问题:box-sizing:border-box 下面用图文的方式来解释下这个属性的效果。
<div class="demo">
<div class="demo_border"></div>
</div>
.demo{width:300px;height:300px;background:#f0f0f0;position:relative;}
.demo_border{width:300px;height:300px;border:10px solid #009933;}
.demo{width:300px;height:300px;background:#f0f0f0;position:relative;}
.demo_border{width:300px;height:300px;border:10px solid #009933;box-sizing:border-box;}