我正在寻找一种使用CSS创建“固定”HTML对象在浏览器屏幕上的技巧。我想让它始终保持在同一位置,即使用户滚动文档时也是如此。我不确定这个术语的正式名称。
就像Facebook上的聊天按钮或某些网站上的反馈按钮一样,它会随着页面滚动而跟随您。
在我的情况下,我想始终将一个div保持在屏幕的右下角位置。欢迎提供示例CSS。
HTML
<div id="fixedbtn"><button type="button" value="Delete"></button></div>
CSS
#fixedbtn{
position: fixed;
margin: 0px 10px 0px 10px;
width: 10%;
}
<div style="top: 0; position: sticky;">your code</div>
或者您可以像这样添加类/ID:
HTML:
<div class="FixedPosition">your code</div>
CSS:
.FixedPosition{
position: sticky;
top: 0;
}
如果您不想让它在屏幕顶部,请更改“top”,但请勿删除“top”,否则它将无法正常工作。
希望这可以帮到您:)