css补

一定要接触到的一个知识点就是

CSS

的盒子模式，这就是

DIV

排版的核心所在，传统的表格排版是通过大小不

一的表格和表格嵌套来定位排版网页内容，

改用

CSS

排版后，

就是通过由

CSS

定义的大小不一的盒子和盒子嵌套来编排网页。

因为用这种方式排版的网页代码简洁，更新方便，能兼容更多的浏览器，比如

PDA

设备也能正常浏览，所以放弃自己之前钟

爱的表格排版也是值得的，

更重要的是

CSS

排版网页的优势远远不只这些，

本人在这里就不多说，

自己可以去查找相关信息。

理解

CSS

盒子模型

什么是

CSS

的盒子模式呢？为什么叫它是盒子？先说说我们在网页设计中常听的属性名：内容

(content)

、填充

(padding)

、

边框

(border)

、边界

(margin)

，

CSS

盒子模式都具备这些属性。

CSS

盒子模式

这些属性我们可以把它转移到我们日常生活中的盒子

（箱子）

上来理解，

日常生活中所见的盒子也具有这些属

性，所以叫它盒子模式。那么内容就是盒子里装的东西；而填充就是怕盒子里装的东西（贵重的）损坏而添加的泡沫或者其

它抗震的辅料；边框就是盒子本身了；至于边界则说明盒子摆放的时候的不能全部堆在一起，要留一定空隙保持通风，同时

也为了方便取出嘛。在网页设计上，内容常指文字、图片等元素，但是也可以是小盒子（

DIV

嵌套），与现实生活中盒子不

同的是，现实生活中的东西一般不能大于盒子，否则盒子会被撑坏的，而

CSS

盒子具有弹性，里面的东西大过盒子本身最多

把它撑大，但它不会损坏的。填充只有宽度属性，可以理解为生活中盒子里的抗震辅料厚度，而边框有大小和颜色之分，我

们又可以理解为生活中所见盒子的厚度以及这个盒子是用什么颜色材料做成的，

边界就是该盒子与其它东西要保留多大距离。