[分享]css两个盒子间隔有颜色

在网页设计中，有时需要制作两个盒子间隔有颜色的效果，这种效果通常可以使用CSS来实现。

.box1 {
  background-color: #fff;
  padding: 20px;
}

.box2 {
  background-color: #e9e9e9;
  margin-top: 20px;
  padding: 20px;
} 

上面的代码中，我们创建了两个盒子，分别为.box1和.box2。我们先让.box1的背景颜色为白色，padding为20px，这样可以让盒子内的内容与盒子边缘有一定的间隔。然后，我们创建.box2，让它的背景色为灰色，margin-top为20px，这样就能够让两个盒子之间产生间隔。同时，我们也让.box2和.box1一样，内部padding为20px。

上面的代码只是一个简单的实现方法，你可以根据自己的需要进行相应的调整。通过使用CSS，你可以轻易地制作出各种有趣的效果，让你的网页设计更加生动有趣。