如何仅基于内联样式定义override Css？

Question

有这样一个元素：

<td style="border: 2px solid red; background: darkred;"></td> 
<td style="border: 2px solid blue; background: darkblue;"></td> 

所展示的唯一的事情是这是内嵌式的，我以为他们是基于在后端的SQL查询的定义。我想写一个CSS样式表来覆盖这种风格（从前端，并没有访问该网站的后端）;但定义它的唯一方法是基于元素的实际内联样式，因为没有类或id。

我知道，你可以对某些非CSS元素定义CSS，如形式name或for，这样做就像这样：

td[name=thename] { /*css here */ } 
td[for=thefor] { /*css here */ } 

所以，我怎么能做到这一点基于风格？

Answer 1

您可以复制属性选择器中的内联样式，然后使用!important规则覆盖它们，例如，

td[style="border: 2px solid blue; background: darkblue;"] { 
    background: lightgray !important; 
} 

例子：http://jsfiddle.net/Dwew3/1/

Answer 2

对于新的浏览器可以使用第n个子选择，并添加重要的样式！

td:nth-child(even) { background-color:blue !important; } 
td:nth-child(odd) {background-color:black !important; } 

我在这个fiddle有一个例子。不幸的是，它在旧版浏览器中无法使用。如果你可以使用javascript或jQuery，你可以用更好的浏览器支持来做基本相同的事情。