我有一排表:
- <table>
- <tr class="even"><td>tr0</td></tr>
- <tr><td>tr1</td></tr>
- <tr class="even"><td>tr2</td></tr>
- </table>
对于偶数行,我有一个CSS规则(rule1):
- .even{
- background-color: blue;
- }
我有另一个规则(rule2)覆盖任何行的bgcolor:
- .override,.override.even{
- background-color: green;
- }
奇怪的是在IE9所有甚至行(没有覆盖类)都是绿色的!
开发人员工具可显示偶数行:
在这两个条件下,IE正常工作:
如果我像这样重写rule2:
- .override,.override .even{ ... }
如果我将rule2移到rule1上面:
- .override,.override.even{ ... }
- .even { ... }
问题是.override.even和.override之间有什么区别?
编辑:
解决方法
类型说明符之间的间距意味着上升 – >后代关系.
规则:
- .test .heading { font-weight: bold; }
将适用于< p>元素在这里:
- <span class="test"><p class="heading">Something</p></span>
缺少空格意味着该元素必须具有两个类才能应用规则.
规则:
- .heading.major { color: blue; }
将适用于< p>元素在这里:
- <p class="heading major">Major heading</p>