用 CSS3 將影像轉換為灰度
要在 CSS3 中將影像轉換為灰度,請使用濾鏡屬性的灰度值。
示例
讓我們看一個示例——
<!DOCTYPE html> <html> <head> <style> img.demo { filter: brightness(120%); filter: contrast(120%); filter: grayscale(130%); } </style> </head> <body> <h1>Spring Framework</h1> <img src="https://tutorialspoint.tw/spring/images/spring-mini-logo.jpg" alt="Spring" width="160" height="150"> <h1>Learn MySQL</h1> <p>Below image is brighter and has more contrast than the original image above. With that the image is in grayscale:</p> <img class="demo" src="https://tutorialspoint.tw/spring/images/spring-mini-logo.jpg" alt="Spring" width="160" height="150"> </body> </html>
輸出
廣告