在網頁設計中，圖片在頁面之間扮演著非常重要的角色。然而，簡單地使用HTML標記添加圖片會讓網頁變得十分沉重，而且無法實現較為復雜的設計效果。幸運的是，CSS提供了多種方式來添加圖片并控制它們在頁面中的顯示方式。

一種添加圖片的方法是使用background-image屬性。通過在CSS樣式中添加如下代碼，可以將指定的圖片設置為元素的背景圖像：

element {
background-image: url("image.jpg");
}

其中，element可以是任何HTML元素，例如div、p或者a標簽等。url()中的圖片路徑可以是圖片在本地文件系統中的相對路徑或完整的URL。

如果需要設置圖片的重復方式或位置，可以使用background-repeat和background-position屬性。其中，background-repeat屬性控制圖片的重復方式，例如將其設置為no-repeat可以讓圖片只顯示一次。而background-position屬性可以將圖片定位在元素內的具體位置。例如：

element {
background-image: url("image.jpg");
background-repeat: no-repeat;
background-position: center;
}

除了使用背景圖片，CSS還提供了另一種方法添加圖片：使用img標簽。這種方法可以為元素添加單獨的圖片，而不是設置整個元素為背景。但是需要注意的是，img標簽需要將圖片路徑作為其src屬性的值，而且需要在HTML中添加元素。

<img src="image.jpg">

同樣地，也可以使用CSS樣式控制img標簽的顯示方式。例如：

img {
width: 300px;
height: 200px;
border: 1px solid black;
}

這里使用了width、height和border屬性來設置圖片的大小和邊框。

總的來說，CSS提供了多種方式來添加圖片并控制它們的顯示方式。熟練運用這些樣式，可以實現各種各樣的頁面設計效果。