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

Question

所以，我有一个是位于页面的右下角如图片所示（“电流”）按钮：

的设置很简单：

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

现在，有没有办法找到“可见”屏幕底部的按钮，而不需要在“需要”图片上显示的内容底部？

谢谢！

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

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