我不明白为什么我的固定背景开始出现，因为它有时没有被固定。
这是一个非常特殊的案例，我知道如何解决它。
您可以删除:
.row2 position:relative
或
row1 div -webkit-backface-visibility: hidden;
但我不明白为什么会出现这个问题，position:relative 或 -webkit-backface-visibility:hidden 如何影响此行为。
我认为这个问题可以引起某人的兴趣。
这里是例子:JSfiddle
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" >
<title>Theme Framework</title>
<style>
.row1 {
height:45px;
}
.row1 div {
height:47px;
-webkit-backface-visibility: hidden;
}
.row2 {
position: relative;
height:500px;
background-image:url(http://www.hdwallpapers.in/download/uphill_road-1024x768.jpg);
background-position: 50% 23px;
background-attachment: fixed;
background-size:cover;
}
</style>
</head>
<body>
<div class="row1">
<div>
</div>
</div>
<div class="row2"></div>
</body>
</html>
最佳答案
在这种情况下，看起来 backface-visibility 正在干扰 background-attachment。这里的关键是具有 backface-visibility 的元素比包含它的元素要高。这意味着它延伸到 row1 下面。将 overflow:hidden 添加到 row1 可解决此问题。
CSS:
.row1 {
height:45px;
overflow: hidden;
}
就这里实际发生的事情而言。我的猜测(仍在寻找完整的答案)因为具有 backface-visibility 的元素重叠并覆盖了背景固定样式。可能是渲染引擎出错。
关于html - Chrome : Fixed background is displayed as it wasn't fixed，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/21511320/