Đoạn mã sau sẽ hiển thị thanh tiêu đề, thanh chân trang và hình ảnh, nhưng vì một số lý do, ngay khi tôi thêm .div1 { -webkit-transform-style: preserve-3d; }
tôi chỉ nhận được thanh tiêu đề. Tôi biết nó dường như có một số divs không cần thiết và phong cách áp dụng, nhưng tôi cần chúng cho các hiệu ứng mà tôi đã bị loại bỏ để làm cho gỡ lỗi dễ dàng hơn. mã trang của tôi là:Tại sao "-webkit-transform-style: preserve-3d;" làm cho một số div biến mất?
<html>
<head>
<title></title>
<style>
body {
margin: 0px;
}
.div1 {
-webkit-transform-style: preserve-3d;
}
.div2 {
position: absolute;
width: 100%;
height: 100%;
}
img {
max-width: 50%;
max-height: 50%;
display: block;
}
.footer {
position: fixed;
bottom : 0px;
}
</style>
</head>
<body>
<div class="div1">
<div class="div2">
<div class="header">
Header
</div>
<div class="imgdiv">
<img src="http://static.guim.co.uk/sys-images/Guardian/Pix/pictures/2012/5/18/1337331092888/Cwm-Idwal-Snowdonia.-Mich-007.jpg">
</div>
<div class="footer">
Footer
</div>
</div>
</div>
</body>
</html>
Làm thế nào khó hiểu. Thankyou – Grezzo
Chắc chắn rồi! Điều quan trọng cần nhớ là thông số kỹ thuật cho những điều này chưa phải là cuối cùng. Ngay cả CSS3 hình ảnh động (một spec đó là trưởng thành hơn 3d canvas) đã được tìm thấy lỗi (vì spec, không phải vì trình duyệt thực hiện) và spec sẽ thay đổi sớm. – Brian
Thật thú vị, bạn có biết bất kỳ bài viết nào thảo luận về các lỗi trong spec không? – Grezzo