?

如果你不能理解什么盒子，那我们这里暂且把一组<div> </div>当作一个盒子，一个用来存放内容的容器。
?

范例：

?

相关代码如下：

在以上的CSS代码中，设置了背景色，但是实际效果中并没有显示出来，是因为背景图片覆盖了背景色。另外margin的效果也不明显，让我们将两个盒子放到一起时候，效果会明显点。

在这个例子中，实际看到的盒子边框的宽度是200px + 20px + 20px = 240px，同样，高度是150px + 20px + 20px = 190px;

其中padding，包括了padding-top,padding-right,padding-bottom,padding-left，可以单独设置每个属性的值，当四个属性的值一样时候，可以只用一个padding实现同样的效果，"border","margin"也是同样的道理。更多的CSS属性介绍我们将在以下部分学习到。