Tidadigi Logo

CSS brightness() Function

Hàm brightness() là một hàm dựng sẵn dùng để áp dụng bộ lọc độ sáng cho ảnh. Hàm này sử dụng hệ số nhân tuyến tính để tăng hoặc giảm độ sáng.

Cú pháp:

brightness( amount )

Tham số: Hàm này chấp nhận tham số duy nhất là amount, chứa giá trị độ sáng. Giá trị độ sáng được tính theo số và phần trăm. Giá trị 0% thể hiện ảnh đen hoàn toàn, 100% là ảnh gốc.

Ví dụ sau minh họa hàm brightness() trong CSS:

Ví dụ:

html 
<!DOCTYPE html> 
<html> 

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

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

</html>

Đầu ra:

 css-brightness-function 

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

  • 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