在前端開發中，我們經常會使用背景圖片來美化網頁，但是有時候圖片的顏色可能不太和我們的設計風格相符，這時我們可以利用CSS使背景圖更亮。

/*先添加一個背景圖片*/
body {
background-image: url("example.jpg");
}
/*然后使用CSS filter屬性使圖片亮度增加*/
body {
filter: brightness(130%);
}

在上面的代碼中，我們先添加了一個背景圖片到body元素中，然后在body的CSS樣式中使用了filter屬性，并把亮度值調整為130%。這樣就能讓圖片變得更明亮。

除了brightness()方法，還有很多其他的CSS filter屬性可以用于修改圖片的顏色和外觀。例如，我們可以使用saturate()方法增加飽和度，使用contrast()方法增加對比度，等等。

/*將圖片飽和度增加至150%*/
body {
filter: saturate(150%);
}
/*增加圖片對比度至200%*/
body {
filter: contrast(200%);
}

在使用filter屬性時，我們需要注意以下幾點：

• filter屬性可能會影響元素的性能，因為它是在渲染階段中處理的。
• 一些瀏覽器可能不支持所有的CSS filter屬性。
• 對于某些屬性，如blur()方法，需要使用WebKit前綴來兼容不同的瀏覽器。

因此，在使用CSS filter屬性時，我們需要根據設計要求和瀏覽器兼容性做出合適的選擇。