Dự phòng cho css3 nhiều hình nền?

Question

Tôi đã có 2 hình ảnh làm nền của cơ thể của tôi:

background: url(../img/upper_bg.png) 0 495px repeat-x, url(../img/bg.png) repeat; 

tôi phát hiện ra rằng để hiển thị upper_bg.png trên bg.png hình ảnh tôi cần phải đặt nó đầu tiên trong danh sách. Tuy nhiên đối với các trình duyệt không hỗ trợ nhiều nền tôi muốn hiển thị chỉ bg.png, tôi lo ngại rằng trình duyệt rơi xuống upper_bg.png làm dự phòng thay vì bg.png. Làm cách nào để khắc phục sự cố này?

Answer 1

Đơn giản chỉ cần thêm một tuyên bố background chỉ với bg.png trước nhiều nền nên làm điều đó:

background: url(../img/bg.png) repeat; 
background: url(../img/upper_bg.png) 0 495px repeat-x, url(../img/bg.png) repeat; 

trình duyệt cũ hơn sẽ bỏ qua dòng thứ hai và giữ cho dòng đầu tiên; họ không nên cố gắng sử dụng bất kỳ phần nào của dòng thứ hai. Các trình duyệt hỗ trợ nhiều hình nền sẽ sử dụng dòng thứ hai thay vì dòng đầu tiên bằng cách ghi đè nó như bình thường.