將影像轉換為HTML/CSS 中的灰階：一個簡單的解決方案
在CSS 的幫助下可以以灰度顯示彩色點陣圖過濾器。這種方法提供了跨瀏覽器解決方案，並且實作起來相對簡單。
要使用 CSS 對圖片套用灰階效果，只需將以下程式碼新增至樣式表：
img {
filter: gray; /* IE6-9 */
-webkit-filter: grayscale(1); /* Google Chrome, Safari 6+ & Opera 15+ */
filter: grayscale(1); /* Microsoft Edge and Firefox 35+ */
}此程式碼會將頁面上的所有圖片轉換為灰階。或者，您可以定位特定影像：
#my-image {
/* CSS styles */
filter: gray; /* IE6-9 */
-webkit-filter: grayscale(1); /* Google Chrome, Safari 6+ & Opera 15+ */
filter: grayscale(1); /* Microsoft Edge and Firefox 35+ */
}要停用懸停時的灰階效果，請加入以下程式碼：
#my-image:hover {
-webkit-filter: grayscale(0);
filter: none;
}使用這個簡單的CSS 解決方案，您可輕鬆顯示影像灰度，無需SVG 或Canvas 等複雜技術。
以上是如何僅使用 HTML 和 CSS 輕鬆將圖片轉換為灰階？的詳細內容。更多資訊請關注PHP中文網其他相關文章！
