如何在表内工作下划线

Question

我正在尝试更改文本颜色，并在选择链接时将文本加下划线（它将具有“已选中”类）。出于某种原因，我甚至无法使用！重要。是的，我知道“a”应该在“li”里面：）

HTML：

<a href="">
<li class="list selected">
<table>
<tr><td class="first">Text here</td><td class="second"><div class="icon-arrow-down"></div></td></tr>
</table>
</li>
</a>

CSS：

table {
    .selected {
        color:green !important;
        text-decoration:underline !important;
    }
}

这是我的小提琴http://jsfiddle.net/vwLu8/1/。

Answer 1

除非您使用预处理器，否则不应嵌套您的选择器，您还需要更改特定级别，将CSS更改为：

Demo Fiddle

.selected table td{
    color:green;
    text-decoration:underline;
}

More on specificity from MDN

  

特定性是浏览器决定哪个属性的方法   值是 与元素最相关并且可以应用 。   特异性仅基于由组成的匹配规则   选择不同的种类。