樣式表 - 如何使用列組修改位於該列中的TH標籤

Question

我是新來修改表中的列組並嘗試學習如何標記CSS以使特徵列組中的TH具有特定背景顏色，以及該專欄中的TD。我唯一的問題是，我不知道如何設置CSS來反映這些部分。

我已經位於一個示例表：http://jsbin.com/ocezon/1/edit

如果我沒有這句話正確，請讓我知道，我會嘗試進一步解釋。我已經標記了TH和TD，我希望能夠使用列組分配的＃table-5 #featured屬性進行修改。

我試過像#table-5 #featured TH { background: #000; }這樣的代碼，但沒有奏效。

---

編輯：我發現，這可能是不可能的（和嘗試多種方法後，我不能讓任何工作）......所以我決定給答案一招的小馬建議一種可行的方法;不過，我稍微修改這個方法可以很容易地在未來修改：http://jsbin.com/icasom/1/edit

Answer 1

不使用colgroups，你可以風格每一行的第3個孩子：

#table-5 th:nth-child(3){ 
    background: blue; 
} 

#table-5 tr td:nth-child(3){ 
    background: #C0000E; 
} 

http://jsbin.com/ocezon/3

---

我對此進行了修改，使其更容易與多個工作臺配合使用，並且可以更輕鬆地進行修改：http://jsbin.com/icasom/1/edit

Answer 2

表中有一個奇怪的HTML結構，COLGROUP和TH甚至沒有在TR包：

<table id="table-5"> 
<colgroup> 
    <col class="row" /> 
    <col class="basic"/> 
    <col class="premium" id="featured"/> 
    <col class="enterprise"/> 
</colgroup> 
    <thead> 
    <tr> 
     <th>row</th> 
     <th>basic</th> 
     <th>premium (modify this TH)</th> 
     <th>enterprise</th> 
    </tr> 
    </thead> 
     <tr> 
      <td>blah</td> 
      <td>blah</td> 
      <td>blah (modfy this TD)</td> 
      <td>blah</td> 
     </tr> 
     <tr> 
      <td>blah</td> 
      <td>blah</td> 
      <td>blah (modfy this TD)</td> 
      <td>blah</td> 
     </tr> 
     <tr> 
      <td>blah</td> 
      <td>blah</td> 
      <td>blah (modfy this TD)</td> 
      <td>blah</td> 
     </tr> 
</table> 

你也許可以添加索姆RGBA顏色變暗的背景顏色： http://jsbin.com/ocezon/9/http://jsbin.com/ocezon/9/edit