这是我的标记:
<div id="nav"> <ul> <li><a href="#">Page 1</a></li> <li><a href="#">Page 2</a></li> <li> <a href="#">Articles</a> <ul class="inside-ul"> <li><a href="#">Article 1</a></li> <li><a href="#">Article 2</a></li> <li><a href="#">Article 3</a></li> </ul> </li> <li><a href="#">Page 3</a></li> </ul> </div>
我将样式应用于父级< ul>像这样:
#nav ul { something; } #nav ul li { something; } #nav ul li a { something; }
我将样式应用于孩子< ul>像这样:
.inside-ul { something; } .inside-ul li { something; } .inside-ul li a { something; }
但问题是,孩子< ul> (.inside-ul)根本不会改变,就像它从父节点继承一样.我已经尝试在我的CSS文件中使用!important但它仍然保持不变.
这是一个正在发生的事情的图像:
http://i47.tinypic.com/w1brkw.jpg
我希望我已经清楚地解释了自己,谢谢.
解决方法
更改
#nav ul { something; }
至
#nav > ul { something; }
这样,CSS仅应用于#nav的子UL而不是子UL.