12

次の表があります。

<table id="test">
 <tr>
  <td>test</td>
  <td>test</td>
  <td>test</td>
 </tr>
 <tr>
  <td>test</td>
  <td>test</td>
  <td>test</td>
 </tr>
</table>

tdCSS を使用して 3 番目の要素を非表示にする必要があります。

その結果、次のような HTML が必要になります。

<table id="test">
  <tr>
    <td>test</td>
    <td>test</td>
  </tr>
  <tr>
    <td>test</td>
    <td>test</td>
  </tr>
</table>

tdすべての行で 3 番目を非表示にするにはどうすればよいですか?

タグ要素にクラスや ID を追加しないでください。CSS のみを使用して非表示にする必要があります。

4

3 に答える 3

23

これを試して:

#test tr td:nth-child(3n+3) {
    display: none;
}

このフィドルをチェックしてください

于 2013-06-12T02:33:57.833 に答える
7
#test tr td:nth-child(3) { display:none; }
于 2013-06-12T02:34:42.640 に答える
0

具体的にターゲットにする ID またはクラスがない場合、css で 3 番目の要素をターゲットにすることはできません。

jQuery を使用してこれを行うことができます。

他のユーザー (n 番目の子を使用) から提供された回答では、コードがブラウザー間の互換性がないという事実は開示されていません。IE <9 はセレクターを表示できません。

于 2013-06-12T02:34:41.310 に答える