如何相对于屏幕（视口）定位元素？

Question

所以，我有一个位于页面右下角的按钮，如图所示（＆＃34;当前＆＃34;）：

设置非常简单：

<div class="content">
    Content
</div>
<div class="button" style="position:absolute;right:0px;bottom:0px;">
    Button
</div>

现在，有没有办法找到＆＃34;可见＆＃34;底部的按钮？屏幕并没有必要在内容的底部，如＆＃34;需要＆＃34;图片？

谢谢！

Answer 1

我相信您正在寻找position: fixed。

#myDiv
{
    position: fixed;
    bottom: 5px;
    right: 5px;
}

JSFiddle

Answer 2

是的，您可以使用position: fixed将其附加到视口的右下角。

selector {
   position: fixed;
   bottom: 0;
   right: 0;
}

  

position: fixed

     

固定定位类似于绝对定位，用   元素的包含块是视口的例外。这是   通常用于创建一个保持相同的浮动元素   滚动页面后即使是位置。