風格特定的無序列表，而不影響其他ul的

Question

這是在做我的堅果和毀了我的週末。

我發現這個偉大的可擴展的jQuery垂直導航菜單。問題是在其他頁面我有無序列表和無序的列表樣式的jQuery垂直菜單影響所有其他無序列表，我不想這樣。 HTML和內嵌CSS等是這個..........

ul{list-style: none; padding: 0; margin: 0;} 
#nav {float: left; width: 280px; border-top: 1px solid #999; border-right: 1px solid #999; border-left: 1px solid #999; margin: 15px 0;} 
#nav li a {display: block; padding: 10px 15px; background: #ccc; border-top: 1px solid #eee; border-bottom: 1px solid #999; text-decoration: none; color: #000;} 
#nav li a:hover, #nav li a.active {background: #999; color: #fff;} 
#nav li ul {display: none;} 
#nav li ul li a {padding: 10px 25px; background: #ececec; border-bottom: 1px dotted #ccc;} 
     <ul id="nav"> 
    <li><a href="#">Item 1</a> 
     <ul> 
     <li><a href="#">Sub-Item 1 a</a></li> 
     <li><a href="#">Sub-Item 1 b</a></li> 
     <li><a href="#">Sub-Item 1 c</a></li> 
     </ul> 
    </li> 
    <li><a href="#">Item 2</a> 
     <ul> 
     <li><a href="#">Sub-Item 2 a</a></li> 
     <li><a href="#">Sub-Item 2 b</a></li> 
     </ul> 
    </li> 
    <li><a href="#">Item 3</a> 
     <ul> 
     <li><a href="#">Sub-Item 3 a</a></li> 
     <li><a href="#">Sub-Item 3 b</a></li> 
     <li><a href="#">Sub-Item 3 c</a></li> 
     <li><a href="#">Sub-Item 3 d</a></li> 
     </ul> 
    </li> 
    <li><a href="#">Item 4</a> 
     <ul> 
     <li><a href="#">Sub-Item 4 a</a></li> 
     <li><a href="#">Sub-Item 4 b</a></li> 
     <li><a href="#">Sub-Item 4 c</a></li> 
     </ul> 
    </li> 
    </ul> 

我試圖改變的CSS UL到#nav ul{list-style: none; padding: 0; margin: 0;}但這似乎沒有工作。請幫我把這個人救出來。乾杯。

玩具

Answer 1

通常，當你下載一個jQuery插件或thingamabob，它有一個文件夾中，就如何使用它的一個例子！但我只是在這裏猜測，你沒有從JQuery UI直接得到這個？

在任何情況下，嘗試包裝你的菜單到一個DIV，用ID =「導航」 ......然後

你的其他UL的頁面裏面應該繼承您上述聲明缺省UL風格。