CSS是前端開發中非常重要的技能之一，可以用來控制網頁的樣式。在實際項目中，我們會經常使用CSS調整圖片的樣式，包括灰度。本文將介紹如何使用CSS調節圖片的灰度效果。

img {
/* 將圖片轉換為灰度 */
filter: grayscale(100%);
}

代碼中的filter屬性可以用來對圖片進行一些特殊處理，如模糊、灰度等。而grayscale()函數可以將圖像轉換成灰度。函數的參數為一個百分比值，表示轉換后的灰度級別。在上面的代碼中，我們把灰度級別設為100%，也就是完全灰度。如果希望圖片部分呈現出來原本的顏色，可以將百分比值調小。

img {
/* 部分灰度 */
filter: grayscale(50%);
}

除了使用百分比，也可以使用其他的單位來表示灰度級別。比如使用整數，取值范圍是0到100。如果想要取消灰度效果，可以將filter屬性設置為none。

img {
/* 取消灰度 */
filter: none;
}

如果想要對不同的圖片設置不同的灰度級別，也可以使用不同的選擇器和樣式?？梢葬槍Σ煌念?、ID或其他屬性來設定。比如：

/* 部分灰度 */
.img-gray {
filter: grayscale(50%);
}
/* 完全灰度 */
.img-gray-all {
filter: grayscale(100%);
}
/* 鼠標懸停翻轉 */
.img-hover {
transition: transform 0.5s;
}
.img-hover:hover {
transform: rotateY(180deg);
}

總結來說，使用CSS調節圖片灰度可以給網頁帶來更好的視覺效果，也可以提升用戶體驗。當然，CSS還有很多其他的用途，開發者們可以根據自己的需求來學習和運用。