我很困惑。我如何以適當的方式爲這個應用CSS？

故事短我有小工具側邊欄。我風格像這樣：我很困惑。我如何以適當的方式爲這個應用CSS？

.widgets ul {padding: 10px}

現在內部部件的上行線路我想避免它填充的一個，但保留所有其他的UL使用10px的默認填充。

所以，我想給類兒童UL，我想沒有填充在這樣

.tabs {padding:0}

我試過ul.tabs和.widgets ul.tabs似乎沒有生效。它仍然接收填充10px。我不能爲小部件中的每個UL進行自定義填充。

你能告訴我我失蹤了嗎？

html是非常基本的。

<ul class="widgets"> 

    <li><h2>Widget title 1</h2> 
      <ul> 
      ....my widget content 
      </ul> 
    </li> 

    <li><h2>Custom widget 1</h2> 
      <ul class="tabs"> 
      ...this one I want to have padding:0.. 
      </ul> 
    </li> 

</ul>

這就是html的基本框架。我設置了padding：10px到PARENT小部件中的任何ul ul，但我想要特定的自定義小部件有它自己的自定義樣式，我不能這樣做:(在這種情況下，ul class = tabs

來源

2010-11-27 Ahmad Fouad

請張貼您的HTML代碼。 – ThiefMaster 2010-11-27 02:43:44

`ul.tabs`適合我。也許你在用別的東西來填充填充？嘗試添加一個背景顏色到你的`ul`，你會注意到它的不同之處。 – casablanca 2010-11-27 02:55:06

檢查元素或Firebug可以提供幫助。看看填充來自哪裏。 – 2010-11-27 03:05:43

CSS中的「C」代表「級聯」。Learn about the cascade，你會看到你的第二個規則是比第一不太具體，所以先勝。一般情況下，更多的類選擇規則獲勝，並#ids王牌最多的事。

要回答你的問題，增加特異性會做到這一點。

.widgets ul.tabs {padding:0}

（假設.tabs確實是在UL像你說的。）

來源

2010-11-27 02:53:29 dman

什麼DMAN在談論，你的代碼的

例如：

http://jsfiddle.net/SebastianPataneMasuelli/8WRam/

（我想你可能會錯過在.widgets的 's'）

來源

2010-11-27 02:55:08

更具體的CSS選擇器應該重寫一個不太具體的。因此，使用.widgets ul.tabs的實驗應該可行。有沒有可能當你測試的時候，你的瀏覽器緩存了一個早期版本，或者其他的？

這是我的示例HTML頁面。首先我按照你的方式嘗試它;它不起作用（因爲它不應該）。然後我改變它到這裏，並且它在Firefox中工作。

<html> 
<style> 
.widgets ul {padding: 10px} 
.widgets ul.tabs {padding:0} 
</style> 
<ul class="widgets"> 

<li><h2>Widget title 1</h2> 
<ul> 
....my widget content 
</ul> 
</li> 

<li><h2>Custom widget 1</h2> 
<ul class="tabs"> 
...this one I want to have padding:0.. 
</ul> 
</li> 

</ul> 

</html>

來源

2010-11-27 02:58:15

我很困惑。我如何以適當的方式爲這個應用CSS？

回答

相關問題