css - 来自非父元素的 CSS 位置

Question

我有一个无法更改的编码限制，并试图找到解决方法，以基于非父级定位 div。

我有以下代码结构，无法更改：

<div class="row">
   <div class="sub-row01"></div>
   <div class="sub-row02"></div>
</div>
<div class="row">
   <div id="sub-row03"></div>
</div>

我要做的是相对于.sub-row02 定位#sub-row03。我尝试过的任何东西都只允许我将 #sub-row03 相对于第一个 .row 定位

我正在努力实现的目标是可能的吗？如果是这样，那么设置样式的正确方法是什么？

score 0 · Accepted Answer

要回答您的问题，纯 css 是不可能的，因为它只允许使用父级或前面的子级进行样式设置。

例如

a + b { } will style b
a ~ b { } will style b
a > be {} will style b

但在这些情况下，没有办法设置 a 样式。

但是，您可以通过 javascript 执行此操作。如果你想走这条路，你可以这样做：

document.getElementById("sub-row03").style.left = document.getElementById("sub-row02").offset().left;

如有必要，我可以写一些更具体的东西，因为我没有测试过，但它应该有助于基本概念。

1 回答 1