Tidadigi Logo

CSS sepia() Function

Hàm sepia() là một hàm tích hợp sẵn. Nó được dùng để áp dụng bộ lọc sepia lên ảnh.

Cú pháp:

sepia( amount )

Tham số: Hàm này nhận một tham số duy nhất là amount. Tham số này giữ giá trị mức độ sepia cần áp dụng.

Giá trị sepia được đặt theo giá trị hoặc phần trăm. Giá trị 0% biểu thị ảnh gốc còn 100% là ảnh sepia hoàn chỉnh.

Ví dụ dưới đây minh họa việc sử dụng hàm sepia() trong CSS:

Ví dụ:

html 
<!DOCTYPE html> 
<html> 

<head> 
    <title>CSS sepia() Function</title> 
    
    <style>
        h1 {
            color:green;
        }
        body {
            text-align:center;
        }
        .sepia_effect {
            filter: sepia(100%);
        }
    </style>
</head> 

<body> 
    <h1>GeeksforGeeks</h1> 
    
    <h2>CSS sepia() function</h2>
    
    <img class="sepia_effect" src= 
"https://media.geeksforgeeks.org/wp-content/cdn-uploads/20190710102234/download3.png"
        alt="GeeksforGeeks logo"> 
</body> 

</html>

Đầu ra:

 css-sepia-function 

Trình duyệt được hỗ trợ: Các trình duyệt hỗ trợ hàm sepia() đượ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
  • Safari 6 trở lên
  • Opera 15 trở lên

Last Updated : 21/07/2025