將樣式應用於表格中的特定行

Question

您好我有一個類似下面的表格，我只想爲屬於該部分的tr應用樣式。

<table> 
    <thead> 
     <tr> 
      <th>1</th> 
      <th>2</th> 
      <th>3</th> 
      <th>4</th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr> 
      <td>5</td> 
      <td>6</td> 
      <td>7</td> 
      <td>8</td> 
     </tr> 
    </tbody> 
</table> 

當我嘗試像下面它正在申請所有trs包括trs。

<style type="text/css"> 
tr 
{ 
height:30px 
} 
</style> 

如何限制此樣式僅適用於標頭部分。

Answer 1

試試這個：

<style type="text/css"> 
tr 
{ 
height:30px 
} 

thead > tr:first-child 
{ 
//put anything you want here 
} 
</style> 

Answer 2

使用，

th 
{ 
height:30px 
} 

否則，您可以使用類

Answer 3

您可以將類添加到TR並指定類的CSS，像這樣的：

<table> 
    <thead> 
     <tr class="give-style"> 
      <th>1</th> 
      <th>2</th> 
      <th>3</th> 
      <th>4</th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr> 
      <td>5</td> 
      <td>6</td> 
      <td>7</td> 
      <td>8</td> 
     </tr> 
    </tbody> 
</table> 

並在CSS：

<style type="text/css"> 
.give-style 
{ 
height:30px 
} 
</style> 

這應該做的伎倆，請選擇這個作爲正確答案，如果它通過點擊打勾符號向左解決您的疑問。

Answer 4

使用這樣

<tr class="my_class"> 

</tr> 

然後在你的CSS，用指它 「」你的類名（ 'my_class'）

.myclass{ 
    //your styles go here 
}