Để chuyển đổi hình ảnh sang Thang độ xám trong CSS3, hãy sử dụng giá trị thang độ xám cho thuộc tính bộ lọc.
Ví dụ
Hãy để chúng tôi xem một ví dụ -
<!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://www.tutorialspoint.com/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://www.tutorialspoint.com/spring/images/spring-mini-logo.jpg" alt="Spring" width="160" height="150">
</body>
</html> Đầu ra
