css - Css 父选择器取决于存在的另一个类

Question

我的标记是这样的：

<li class="cont">
    <a> Click Here</a>
    <form>   </form>
</li>

如果表单应用了一个类例如：ng-dirty，我想更改锚标记的背景颜色。该表单由 angularJs 框架应用这个类，当发生这种情况时，我想通过更改其背景颜色来突出显示“a”标签。

如何使用纯 Css（或 sass）来做到这一点？

谢谢，克里斯。

Answer 1

对此没有特定的 CSS 选择器，但您可以通过组合HTMLchange &来实现所需的效果box-direction:reverse;。像这样写：

HTML

<div class="cont">
 <form class="ng-dirty">   
     <input type="text" value="Hi"/>
 </form>
 <a> Click Here</a>
</div>

CSS

.cont{
    display:-moz-box;
    display:box;
    display:-webkit-box;
    box-direction: reverse;
    -moz-box-direction:reverse;
    -webkit-box-direction:reverse;  
    -moz-box-orient:vertical;
    -webkit-box-orient:vertical;
    box-orient:vertical;
}
.cont > *{
    display:block;
}
.ng-dirty + a{
    background:yellow;
}

检查这个http://jsfiddle.net/8YnTw/它是纯 CSS 的。

Answer 2

你可以用 Angular 简单地做到这一点：

<a ng-class="{'dirty-class': myForm.$dirty}"> Click Here</a>
<form name="myForm">
</form>

http://jsfiddle.net/XYTcL/

Answer 3

使用下一个 css 应该可以工作：

.ng-dirty a {
    background-color: red;
}