CSS 盒子模型

299 阅读1分钟

前言

盒子模型,英文即box model。无论div span a 都是盒子。

但是图片,表单一律都是文本,它们并不是盒子。这个很好理解,比如说,一张图片里并不能放东西,它自己就是自己的内容。

盒子属性

盒子模型一共有4个属性:content内容 \ padding内边距 \ border边框 \ margin外边距

设置盒子模型

页面渲染时,DOM所采用的布局模型,可通过box-sizing设置,根据计算宽高的区域可分为:

content-box  (w3c盒子模型)

padding-box

border-box  (IE盒子模型)

margin-box