Tidadigi Logo

CSS saturate() Function

Hàm saturate() là một hàm tích hợp trong CSS. Nó được dùng để tăng giảm độ bão hòa của ảnh đầu vào.

Cú pháp:

saturate( amount )

Tham số: Hàm này chấp nhận một tham số duy nhất là amount. Tham số này giữ giá trị chuyển đổi. Giá trị của tham số được đặt theo số hoặc phần trăm. Giá trị 0% biểu thị hoàn toàn không bão hòa và 100% biểu thị hoàn toàn bão hòa. Bạn có thể tăng độ bão hòa hơn nữa. Ví dụ dưới đây minh họa hàm saturate() trong CSS:

Ví dụ:

html 
<!DOCTYPE html>
<html>

<head>
    <title>
      CSS saturate() Function
    </title>

    <style>
        h1 {
            color: green;
        }
        
        body {
            text-align: center;
        }
        
        .saturate_effect {
            filter: saturate(250%);
        }
    </style>
</head>

<body>
    <h1>GeeksforGeeks</h1>

    <h4>CSS saturate() function</h4>

    <img class="saturate_effect" src=
"https://media.geeksforgeeks.org/wp-content/cdn-uploads/20190710102234/download3.png" 
         alt="GeeksforGeeks logo">
</body>

</html>

Đầu ra:

css-saturate-function

Trình duyệt được hỗ trợ: Các trình duyệt được hỗ trợ bởi hàm saturate() được liệt kê dưới đây:

  • Google Chrome 18 trở lên
  • Edge 12 trở lên
  • Internet Explorer không được hỗ trợ
  • Firefox 35 trở lên
  • Opera 15 trở lên
  • Safari 6 trở lên

Last Updated : 21/07/2025