首页 > 代码库 > css盒子模型及实例

css盒子模型及实例

1.概述css盒子模型

1>先看看w3c的概述

2>其实css每个元素都是一个盒子(盒模型)

2.css盒子模型种类

1>w3c标准模型—————————>element空间宽度 = content内容 + border + padding + margin

2>IE传统模型(IE6-)—————>element = content = content(border + padding) +margin

3.box-sizing的用法

1>属性:box-sizing: content-box | border-box | inherit

2>用法:content-box是默认的,border-box是IE传统模型

3>一句话:善用box-sizing,拯救布局问题

4>兼容性:IE8+

css盒子模型及实例