在网页开发中，一些小的图片【例如：logo】或者一些大的图片【例如：背景】是不推荐用<图片框>标签来实现的，一般标准的做法是使用CSS的背景-图像命令来实现。

使用CSS来设置背景图像的好处是非常便于控制图像的样式，例如设置图像平铺、拉伸、显示图像区域等效果。

一段常规的背景图示例代码：

<样式>
    .背景{
        背景-图像: 地址(@文件_g.png);
        宽度: 200px;
        高度: 200px;
    }
</样式>
<区块 类名="背景">
    
</区块>

展示效果如下：

知识点：可以看见默认图片是铺满整个标签的，所以使用背景-图像的命令，默认的效果是铺满标签区域；当然也可以使用背景-重复命令来控制图像的显示状态【例如：平铺还是拉伸】。

背景-重复命令的值有以下截图中的选项：

知识点：命令值中重复的含义是平铺，也就是默认效果，不重复含义是取消平铺，正常显示；x轴重复的含义是纵向正常显示，横向平铺；y轴重复的含义是横向正常显示，纵向平铺。

一段纵向平铺横向不平铺的代码如下：

<样式>
    .背景{
        背景-图像: 地址(@文件_g.png);
        宽度: 200px;
        高度: 200px;
        背景-重复: y轴重复;
        背景-颜色: 颜色值-粉色;
    }
</样式>
<区块 类名="背景">
    
</区块>

代码展示效果如下：

点击本处跳转案例下载：点击下载本文实例

采纳500+送小米笔记本电脑