在滑块顶部划分

Question

您好我的网页上有一个滑块，我想在该滑块的顶部放置一个小方框。如何通过css定位实现这一目标？

<div id="slider"></div>
<div id="captionBox"></div>

Answer 1

HTML

<div class="container">
    <div id="slider"></div>
    <div id="captionBox"></div>
</div>

CSS

.container {position:relative}
#captionBox {position:absolute;top:0;left:0}

您可以将顶部和左侧更改为px值，例如10px。然后，您还可以为分层效果应用z-index css规则

解释

绝对定位元素位于其最近上升的边界的偏移处，该边界具有相对定位。在HTML文档的流程中忽略绝对定位的元素，因此您无法浮动它