如何使用CSS"浮动"高于HTML中所有其他内容的div？

Question

我想创建一个div,当用户使用JS悬停在特定对象上时弹出.我知道这一切.但我的问题是,div在文本中并且在弹出时使一切变得丑陋.我希望它漂浮在文本之上.这可能与CSS有关吗？如果没有,是否可以使用插件或脚本语言？

Answer 1

请参考以下示例:

<div class="container">
    <div class="floating">Floating Div</div>
    <div>
        <p>Para Text Goes Here</p>
        <p>More Text</p>
    </div>
</div>

这是你的CSS:

.container {
    border: 1px solid #DDDDDD;
    width: 200px;
    height: 200px;
    position:relative;
}
.floating {
    float: left;
    position: absolute;
    left: 0px;
    top: 0px;
    background-color: grey;
}

要做的事:

在容器和POSITION上使用POSITION:RELATIVE :在浮动div 上使用ABSOLUTE

请看一下工作示例:http://jsfiddle.net/tH84L/

希望这对你有用!