html - 在手写笔中选择父元素

Question

我正在使用 css 预处理器 Stylus，我正在尝试选择元素的第一个父级。

<li><span class="correct">Ja</span></li>
<li><span class="inCorrect">Nee</span></li>
<li><span class="inCorrect">Mss</span></li>

我想根据 span 元素的类来设置 li 元素的样式。

这可能吗？

Answer 1

不，这在 CSS 和 Stylus 中是不可能的，因为它只是编译成 CSS。

但是，在某些情况下，当您想更改父级的外观时，您可以在某种程度上模拟它：您可以在类的元素之后使用另一个元素，并延伸到父级，请参阅此演示：http://dabblet .com/gist/7638112

您需要的 HTML：

<ul>
<li><span class="correct">Ja</span><span class="helper"></span></li>
<li><span class="inCorrect">Nee</span><span class="helper"></span></li>
<li><span class="inCorrect">Mss</span><span class="helper"></span></li>
</ul>

和 CSS：

li {
    position: relative;
    z-index: 1;
}

.helper {
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.correct + .helper {
    background: lime;
}

.inCorrect + .helper {
    background: red;
}

Answer 2

http://stylus-lang.com/docs/selectors.html#relative-reference

http://stylus-lang.com/docs/selectors.html#selector-bif

yourFunc(yourClass)
  if yourClass=='inCorrect'
    color = green

.inCorrect
  ../
    yourFunc(selector())

像这样的东西应该工作！检查文档并使用它。

Answer 3

这可能会有所帮助...

li<.correct
{
   //write your style here
}