如何使div保持在页面上的视点顶部

Question

无论你滚动多远，我都试图让我的div保持在视点的顶部。到目前为止，这是我的代码：

<style type="text/css"> 
#mydiv {
    position:absolute;
    top: 50%;
    left: 50%;
    width:30em;
    height:18em;
    margin-top: -9em; /*set to a negative number 1/2 of your height*/
    margin-left: -15em; /*set to a negative number 1/2 of your width*/
    border: 1px solid #ccc;
    background-color: #f3f3f3;
}
</style>
<div id="mydiv">Test Div</div>

我已经查了很多关于此的事情但没有工作。救命啊！

Answer 1

这适合我。

position: fixed;

提示：当对如何在css中实现xxx感到好奇时，您始终可以检查已经使用过它的网站的源代码。

Answer 2

将position属性更改为fixed：

position: fixed;

来自MDN：

  

位置：已修复
   不要为元素留出空间。而是将其定位在相对于屏幕视口的指定位置，并在滚动时不移动。打印时，将其放在每页的固定位置。

Answer 3

在您的程序中添加以下代码：两者;顶部：0px;