nền: url trong suốt(); làm gì?

Question

tôi thấy một mã css nơi nó được như

body { background: transparent url ('background.jpg') repeat scroll;} 

không giá trị trong suốt làm gì? Tôi đã thử google'ing về điều này, nhưng không có sự giúp đỡ. Background.jpg không chỉ ghi đè lên nó?

Cảm ơn bạn.

Answer 1

transparent là màu. Một phần tử có thể có cả hình nền và màu nền.

Trên đây là tương đương với:

body { 
    background-color: transparent; 
    background-image: url('background.jpg'); 
    background-repeat: repeat; 
    background-attachment: scroll; 
} 

Màu sắc là quan trọng nói chung nếu ví dụ hình nền không tải được hoặc hình ảnh chứa các vùng trong suốt hoặc hình ảnh không lặp lại để lấp đầy toàn bộ khu vực (không được thừa nhận là trường hợp trong ví dụ của bạn).

Tuy nhiên, vì transparent là "giá trị ban đầu", không bao giờ cần thiết khi sử dụng ký hiệu background, vì thuật toán viết tắt tự động đặt tất cả các thuộc tính không xác định thành giá trị ban đầu của chúng.

Như vậy, trường hợp sử dụng duy nhất mà transparent có ý nghĩa như một màu nền bao gồm:

1. không sử dụng viết tắt, nhưng thay vì trực tiếp bằng cách sử dụng background-color bất động sản;
2. sử dụng công cụ này để ghi đè bộ chọn khác áp dụng trực tiếp cho phần tử đó.

Một ví dụ sẽ

body.foo { background-color: blue; } 
body.foo.bar { background-color: transparent; } 

Answer 2

Trên thực tế, nó không phải là cần thiết.

http://www.w3.org/TR/CSS21/colors.html#background
Cho một tuyên bố hợp lệ, 'nền' sở hữu bộ đầu tiên tất cả các thuộc tính nền cá nhân với các giá trị ban đầu của họ, sau đó gán giá trị rõ ràng được đưa ra trong tuyên bố.

Kể từ background-color 's giá trị ban đầu is transparent, nó được áp dụng ngầm khi thiết background:url(...);

Chính xác hơn, quy tắc phong cách của bạn là tương đương với

background-color: transparent; 
background-image: url(...); 
background-repeat: repeat; 
background-attachment: scroll; 
background-position: 0% 0%; 

trong cả hai trường hợp.

Tuy nhiên, nhiều tác giả (bao gồm cả bản thân mình) thích để thiết lập một cách rõ ràng giá trị

• để có thể đọc
• để ngăn chặn bất kỳ lỗi trình duyệt, hoặc đơn giản là
• vì họ không biết tốt hơn