对于在一个区域里包含一个标题和一段文章的设计，我们会使用背景图像来实现。在过去，我们需要创建两个嵌套的元素，并分别定义不同的背景来实现。

 
   
 […] 
 

幸运的是，现在我们只需要使用一个HTML元素section，给它定义两个背景图像就能实现这种效果。

 […] 

我已经为这个设计做了两个背景图像，一个定位到左边，另一个定位到右边。我们可以为这两个背景图像的指定相同的background-image值，只需要用逗号分隔开每个图像的路径。

section { 
background-image : 
url(section-left.png), 
url(section-right.png); }

与此同时，我们也应该指定背景图像的位置和平铺方式，同样用逗号来分隔开它们。

section { 
background-position : 0 0, 100% 0; 
background-repeat : no-repeat, no-repeat; }

为了节省几个字节，我们也可以用样式缩写的方式，把图像路径、平铺方式和位置写在一起。

section { 
background : 
url(section-left.png) no-repeat 0 0, 
url(section-right.png) no-repeat 100% 0; }