如何使用css隱藏表格的第二行？

我有一個表如何使用css隱藏表格的第二行？

<table> 
<tr><td>test data 1</td></tr> 
<tr><td>test data 2</td></tr> 
<tr><td>test data 3</td></tr> 
<tr><td>test data 4</td></tr> 
<tr><td>test data 5</td></tr> 
</table>

要隱藏表的第二行，我使用下面的CSS

table tr:nth-child(2) {display : none;}

但在所有的瀏覽器不能正常工作。請幫幫我。在此先感謝。

來源

2012-08-03 user1369925

有一個回答：http://stackoverflow.com/questions/2751127/how-can-i-select-first-second-or-third-element-with-given-class-name-using-css – 2012-08-03 09:06:43

:nth-child()簡單doesn't work in all browsers（主要是IE），如果你想隱藏使用CSS2第二行中，你可以添加一個特定的類：

<table> 
<tr><td>test data 1</td></tr> 
<tr class="row2"><td>test data 2</td></tr> 
<tr><td>test data 3</td></tr> 
<tr><td>test data 4</td></tr> 
<tr><td>test data 5</td></tr> 
</table> 

table tr.row2 {display : none;}

來源

2012-08-03 09:05:59 Curt

相隔2秒！ +1。 – 2012-08-03 09:07:25

最好的辦法就是給它一個類名。

<table> 
<tr><td>test data 1</td></tr> 
<tr class="hide_me"><td>test data 2</td></tr> 
<tr><td>test data 3</td></tr> 
<tr><td>test data 4</td></tr> 
<tr><td>test data 5</td></tr> 
</table>

然後

.hide_me { display: none; }

來源

2012-08-03 09:06:01

使用鄰接選擇：

table tr:FIRST-CHILD + tr 
{ 
    display:none; 
}

來源

2012-08-03 09:06:20

+1對於CSS 2.1解決方案（IE 7+，參見[我何時可以使用...]（http://caniuse.com/#search=first-）） – jensgram 2012-08-03 09:09:33

不幸的是，像:nth-child()選擇不被舊的瀏覽器的支持。

但是，您可以隨時使用課程，例如.invisible {display:none}並將其應用於要隱藏的<tr>。

<table> 
<tr><td>test data 1</td></tr> 
<tr class="invisible"><td>test data 2</td></tr> 
<tr><td>test data 3</td></tr> 
<tr><td>test data 4</td></tr> 
<tr><td>test data 5</td></tr> 
</table>

來源

2012-08-03 09:07:06 Simone

http://jsfiddle.net/p2b8H/1/

使用jQuery當量（1）是指，0 =>第一行，1 =>第二行，2 =>第三行...等

$(document).ready(function(){ 
    $('table tr:eq(1)').remove(); 
})

來源

2012-08-03 09:21:08

如何使用css隱藏表格的第二行？

回答

相關問題