将一个元素置顶,可以使用CSS的position属性和z-index属性。具体实现如下:
-
给需要置顶的元素添加CSS样式: position:fixed;top:0;z-index:9999;
-
当页面滚动时,该元素会一直固定在页面顶部,因为它的position属性为fixed,top属性为0。
-
z-index属性为层级属性,数值越大的元素越靠上层,因此将需要置顶的元素的z-index属性设为最大值,即9999。
-
如果需要多个元素置顶,则需注意每个元素的z-index设置不同。
示例代码:
<style>
.sticky {
position: fixed;
top: 0;
z-index: 9999;
}
</style>
<div class="container">
<div class="sticky">这是一个置顶元素</div>
</div>