我试图在我的页面顶部有一个 div,它适合顶部和侧面没有空间。
我所看到的关于如何执行此操作的所有示例都将 div 位置设置为绝对位置。
但是当我这样做时,下面的 img 兄弟会移动到带有前一个 div 的页面顶部。
所以我有两个问题。为什么下面的兄弟会移动?另外,如何在没有位置的情况下使 div 与顶部有 0 空间配合:绝对
div {
position: absolute;
top: 0px;
left: 0px;
background: #888888;
width: 100%;
height: 100px;
}
<body bgcolor="#000000">
<div>
<h1>HEADER</h1>
</div>
<img src="pic_mountain.jpg" alt="Mountain View" style="width:304px;height:228px;">
</body>
</html>
您不需要position: absolute
将东西对齐到顶部,只需margin: 0
在body, h1
Like上使用即可:
body, h1 {
margin: 0;
}
看看下面的片段:
body, h1 {
margin: 0;
}
div {
background: #888888;
width: 100%;
height: 100px;
}
<!DOCTYPE html>
<html>
<body bgcolor="#000000">
<div>
<h1>HEADER</h1>
</div>
<img src="http://placehold.it/304x228" alt="Mountain View" style="width:304px;height:228px;">
</body>
希望这可以帮助!
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句