在網頁設計中，圖像是非常重要的元素。為了讓圖像在網頁中展現得更加美觀和優(yōu)雅，我們需要運用一些與圖像相關的CSS屬性。接下來會介紹一些常用的屬性和其作用。

img {
width: 100%;
height: auto;
}

這段代碼表示讓圖片的寬度占滿其父元素，并保持高度的比例自適應變化。

img {
border-radius: 50%;
}

這段代碼表示將圖片的邊框圓角化，使其呈現圓形的效果。

img {
box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.2);
}

這段代碼可以為圖片添加陰影，讓圖片更加立體且突出。

img {
filter: grayscale(100%);
}

這段代碼可以將圖片變灰，適用于一些需要表現冷色調或渲染老舊照片效果的場景。

background-image: url("image.jpg");
background-size: cover;
background-position: center;

這段代碼可以為元素設置背景圖片，并設置其大小和位置。其中cover表示背景圖像擴展來填充元素的整個區(qū)域，center表示背景圖像居中。

總結來說，以上這些CSS屬性都可以讓網頁中的圖片展現得更加豐富和生動。