CSS將表格中的第二個標頭第th個元素與0開始的索引相關聯

Question

我想在下面的html中的第二個th頭元素中應用一些特殊樣式。

我會用什麼CSS？

我想這個CSS，但它不工作：

table > tr > th:nth-child (2) { 
    /*some styles*/ 
} 

<table width="100%" border="1"> 
    <tr> 
     <th>Name</th> 
     <th>Age</th> 
     <th>City</th> 
    </tr> 
    <tr> 
     <td>Sunil</td> 
     <td>34</td> 
     <td>Toronto</td> 
    </tr> 
    <tr> 
     <td>Mike</td> 
     <td>36</td> 
     <td>Dallas</td> 
    </tr> 
    <tr> 
     <td>Ricky</td> 
     <td>46</td> 
     <td>El Paso</td> 
    </tr> 
</table> 

Answer 1

你錯過了（自動插入）tbody從您的選擇：

table > tbody > tr > th:nth-child(2) { 
    /* styles */ 
} 

，你可以，當然，在這種情況下只需使用不太具體的選擇器：

th:nth-child(2) { 
    /* styles */ 
} 

這是可行的，因爲<th>始終爲<tr>，總是在<table>;唯一可以改變的祖先（在表格內）是tbody（相反，它可能是<thead>或<tfoot>）。