我正在做一个简单的网站。 在这个网站中，我有几个不同层的 div(一个在另一个前面等等)。 后面的两个 div 没有问题，但是当我调整浏览器大小时，前面的 div 会移动，我不希望这样。 奇怪的是后面的 div 是以相同的方式创建的。 所以基本上是什么搞乱了我的页面:#icone_esquerda 和 #icone_direita。 下面是我的代码:
<style type="text/css">
#fundo{
background-image:url("tileable_wood_texture_copy.png");
background-repeat:repeat;
position:fixed;
width:100%;
height:100%;
top:0;
left:0;
}
#frente{
background-image:url("luinguica.png");
background-repeat:no-repeat;
background-position:top center;
position:fixed;
width:inherit;
height:inherit;
left: 0;
top: 0;
z-index:50;
}
#icone_esquerda{
background-image: url("botao_facebook.png");
background-position: bottom center;
background-repeat: no-repeat;
height: 50px;
left: 45%;
margin: -25px 0 0 -25px;
position: fixed;
top: 45%;
width: 50px;
z-index: 60;
}
#icone_direita{
background-image: url("botao_mail.png");
background-position: bottom center;
background-repeat: no-repeat;
position: fixed;
width: 50px;
height: 50px;
left: 53%;
top: 45%;
margin: -25px 0 0 -25px;
z-index: 60;
</style>
</head>
<body>
<div id="fundo">
<div id="frente">
<a href="http://www.facebook.com/confrariadaempada">
<div id="icone_esquerda">
</div>
</a>
<a href="mailto:info@confrariadaempada.pt">
<div id="icone_direita">
</div>
</a>
</div>
</div>
</body>
当我调整浏览器大小时，id 为 icone_esquerda 和 icone_direita 的 div 会移动! 谁能帮帮我？
提前致谢。
最佳答案
Fixed 应该根据屏幕将其保留在指定区域 - 它的位置、大小等。
Absolute 使其保持原样，无论位置或大小如何。
确实，应该很少(如果有的话)使用它们。最好学会根据需要使用带有 float 的 Relative 定位元素(当然要正确清除)。
关于html - 调整浏览器大小时，前面的 div 会移动，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/16290141/