我有 3 个输入和一个图像（与 xy 和 z 测量有关）。它们都相当自然地定位，因此我使用左侧和顶部 px 值来使它们准确。到目前为止，我使用了相对定位。
我的问题是当我更改一个复选框时，我隐藏了 z 输入并更改了图像。当我这样做时，一切都以一种可怕的方式发生了变化。页面底部也有大量空白区域，这可能是由于图像使用了负的顶部值。
我应该使用绝对定位还是其他东西？
谢谢，
瑞克
FIDDLE： http: //jsfiddle.net/WY2DX/52/（使用 SCSS 可能是 CSS 问题：s）
问问题
66 次
3 回答
3
假设您需要添加和删除元素，您可能不应该使用相对定位。相对意味着元素在定位方面不会从 DOM 中移除，因此一个元素的大小和位置会影响下一个元素。
十步学习 CSS 定位是一个很棒的教程，它让你了解不同的定位方法。我相信您正在寻找的是step 4，position:relative对于父容器，然后position:absolute是您的 x、y 和 z 标签。
编辑：
我不完全清楚您的示例应该如何工作，但我想知道标签是否真的是为了自发定位，还是图像是？您可能还想考虑让标签正常定位，并position:absolute用于图像？
于 2012-04-26T16:53:30.713 回答
1
你能证明你正在使用的基本标记/css设置吗？
但是，是的，您的两个问题似乎都是由使用 [position: relative;] 引起的，因为它相对于其原始位置定位元素。意思是如果元素'A'最初出现在 0, 0 (X,Y) 并且你这样做 { position: relative; 左：120px；上：120px；}，元素“A”将重新定位到 120、120 (X,Y)，但它仍然在 0,0 (X,Y) 处占用“物理空间”。这样，当您隐藏或删除其中一个元素时，该“物理空间”将不再被使用，其余内容将发生变化以适应变化。
您可以使用绝对定位来避免这种情况，但这也可能取决于使用的上下文。
于 2012-04-26T16:54:09.190 回答
1
对父容器使用相对定位，对每个子项使用绝对定位。这样添加或删除子元素不会影响其任何兄弟元素。
于 2012-05-28T10:19:08.967 回答