css背景和盒模型

CSS是指层叠样式表，是用来美化网站页面的重要元素。在CSS中，背景和盒模型是非常重要的部分。

首先，让我们来谈谈CSS背景。在CSS中，可以用“background”属性来控制网页中各个元素的背景。例如：

body {
  background-color: #f5f5f5;
  background-image: url("bg-image.jpg");
  background-repeat: repeat;
}
 

以上代码中，我们通过“background-color”设定了页面的背景颜色，使用“background-image”指定了页面背景图片，并使用“background-repeat”来控制图片是否平铺。

接下来，我们来说一下盒模型。盒模型是CSS布局中非常重要的概念，用来定义一个网页元素的尺寸和边框。盒模型包括四部分：

• content（内容）
• padding（内边距）
• border（边框）
• margin（外边距）

当我们使用CSS控制一个元素的尺寸时，实际上就是控制这个盒模型中content的尺寸。例如：

div {
  width: 300px;
  height: 200px;
  border: 1px solid #ccc;
  padding: 10px;
  margin: 20px;
}
 

以上代码中，我们为一个