CSS是一門用于網頁設計的語言，它可以控制HTML中的元素，控制元素的樣式和布局。其中，CSS圖片顏色變灰是一種常用的效果，它可以將彩色圖片轉換為黑白或灰色圖片，增強圖片的視覺震撼力。

img {
filter: grayscale(100%);
/* 兼容性代碼：-webkit-filter */
-webkit-filter: grayscale(100%);
filter: gray; /* IE/Edge兼容 */
}

上述CSS代碼使用了filter屬性和grayscale函數來實現圖片的變灰。grayscale函數可以設置顏色的飽和度，數值范圍從0%到100%，其中100%表示完全灰度，即黑白圖片。

為了增強代碼的兼容性，在現代瀏覽器下我們還可以使用-webkit-filter，同時在IE和Edge瀏覽器中可以使用filter:gray來實現效果等同于grayscale(100%)。

總之，CSS圖片顏色變灰是一種簡單而實用的效果，可以在視覺上增強頁面的美感，讓網站內容更有吸引力。