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
}

在手写笔中选择父元素

3 个答案: