在CSS中，使用background-image屬性來定義元素的背景圖片。
語法：
background-image:url("圖像地址");
說明：
圖像地址可以是相對地址，也可以是絕對地址。請看“相對地址和絕對地址”。
舉例：
在線測試
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>background-image屬性</title>
<style type="text/css">
#div1
{
width:143px;
height:220px;
background-image:url("../App_images/lesson/run_cj/one piece.jpg");
}
</style>
</head>
<body>
<div id="div1">這是一張海賊王圖片</div>
</body>
</html>
在浏覽器預覽效果如下：
分析：
給某個元素設置背景圖像，元素要有一定的寬度和高度，背景圖片才會顯示出來。因此在這裡設置了div元素的寬width和height，其中width值和height值跟圖片實際的寬度和高度一樣。
在上面例子中，如果我們沒有id="div1"的元素設置高度，則在浏覽器預覽效果如下：
這樣的話，背景圖片就無法完整地顯示出來了。
大家在上面例子的在線測試中修改div元素width和height這兩個的屬性值看看效果。