Nỗ lực của tôi để sử dụng background-clip: content-box
không thành công. Toàn bộ hộp có nền, bao gồm cả vùng đệm, không chỉ vùng nội dung.Tại sao tôi không thể sử dụng hình nền?
http://jsfiddle.net/alanhogan/7YjCV/6/
Tôi đang làm gì sai?
Nỗ lực của tôi để sử dụng background-clip: content-box
không thành công. Toàn bộ hộp có nền, bao gồm cả vùng đệm, không chỉ vùng nội dung.Tại sao tôi không thể sử dụng hình nền?
http://jsfiddle.net/alanhogan/7YjCV/6/
Tôi đang làm gì sai?
Đây là dấu hiệu chung với các thuộc tính viết tắt trong CSS.
Vì background-clip
is one of the properties that's set by the background
shorthand property, phong cách của bạn được background
ngầm thiết background-clip
-border-box
(giá trị ban đầu của nó), trọng rõ ràng background-clip
phong cách của bạn:
background-clip: content-box;
background: #ddd none /* border-box */;
Nếu bạn di chuyển khai background-clip
của bạn bên dưới background
, nó sẽ làm việc như mong đợi :
background: #ddd none;
background-clip: content-box;
Thuộc tính CSS background
là cách một dòng để xác định tất cả các thuộc tính nền nền, bao gồm background-clip
. Do đó, việc chỉ định background: #ddd
sẽ hủy cài đặt trước đó của bạn là background-clip
. Thay vào đó, nếu bạn thay thế dòng đó bằng background-color: #ddd
, nó sẽ hoạt động theo cách bạn muốn.
Here's sửa đổi nhỏ đối với jsfiddle của bạn.
Đánh giá cao câu trả lời của bạn :) –
Cảm ơn bạn. Khùng. Tôi hiểu thuộc tính phím tắt và chính xác cách thức hoạt động này, nhưng với điều kiện thuộc tính phím tắt 'background' đã tồn tại * mãi mãi *, tôi cho rằng nó đã được mở rộng/định nghĩa lại để bao gồm các thuộc tính thậm chí không sử dụng hiện hữu! –
@Alan H: Vâng, vấn đề là, CSS được phiên bản ở * mức *, nơi các tính năng mới được thêm vào và đôi khi những tính năng hiện có được tinh chỉnh - vì vậy khi các thuộc tính mới được thêm vào, nó chỉ thích hợp cho các phiên bản mới của các thuộc tính viết tắt được mở rộng để bao gồm các thuộc tính mới này. Xem thêm: http://www.w3.org/TR/CSS/#css-levels Tương tự như vậy, một số bộ chọn * giống như ': not()' cũng sẽ được tăng cường để chấp nhận một phạm vi rộng hơn các bộ chọn trong CSS4. – BoltClock
Xem thêm: [CSS3 có phải là tiêu chuẩn chính thức không?] (Http://stackoverflow.com/questions/8637901/is-css3-an-official-standard/8637917#8637917) – BoltClock