位置叠加div

Question

我在表格单元格中有一个链接,当点击链接时,我显示一个隐藏的div.

目前我使用position:absolute和z-index:10.它工作正常,但我想将它移动到顶部和左侧.当我添加top:-10px和left:-10px时,div移动到窗口的位置.

如何将它从表格单元格中取出10px？

Answer 1

您需要使用position relative设置父元素,然后在要定位的元素上使用position absolute.因此,如果您希望根据表格定位它,您需要添加位置:相对于表格(它不会做任何事情,因为它已经相对定位)和位置:绝对值到叠加层.绝对定位将元素从文档流中取出,并且相对定位将其留在文档流中,这就是移动物体的原因.其原因在于CSS的工作原理:http://www.w3schools.com/css/pr_class_position.asp

relative 元素相对于其正常位置定位,因此"left:20"将20个像素添加到元素的LEFT位置

absolute 元素相对于其第一个定位(非静态)祖先元素定位

您可能也对修复感兴趣.

fixed 元素相对于浏览器窗口定位

这是一个例子:http://pastehtml.com/view/av391nzsv.html

Answer 2

position: relative;

代替

position: absolute;

相对表示从父元素开始测量顶部和左侧，绝对表示从页面左上角开始测量。