隱藏表格行使用CSS

是否可以隱藏表格行使用CSS，我有一個需要這個概念的項目。這裏是我的代碼：隱藏表格行使用CSS

的style.css：

#hide-row { display:none; }

file.php

<table> 
    <tr> 
     <th>Name</th> 
     <th>Address</th> 
    </tr> 
    <div id="hide-row"> 
    <?php foreach($cops as $row) { ?> 
     <tr> 
      <td><?php echo $row->name; ?></td> 
      <td><?php echo $row->address; ?></td> 
     </tr> 
    <?php } ?> 
    </div> 
</table>

但是，它沒有工作，記錄仍然會出現。任何人都可以幫助解決這個問題？任何幫助將不勝感激。感謝您進階！

來源

2013-03-27 Philips Tel

你有多個'捉迷藏row' IDS？ – Vimalnath 2013-03-27 09:15:12

不，我只有一個。 – 2013-03-27 09:19:40

使用，而不是一個ID類：

.hide-row { display:none; }

而在你的HTML/PHP文件：

<table> 
    <tr> 
     <th>Name</th> 
     <th>Address</th> 
    </tr> 
    <?php foreach($cops as $row) { ?> 
     <tr class="hide-row"> 
      <td><?php echo $row->name; ?></td> 
      <td><?php echo $row->address; ?></td> 
     </tr> 
    <?php } ?> 
</table>

如果你將你行，你可以使用一個tbody標籤，而不是div標籤。

Can we have multiple <tbody> in same <table>?

.hide-row tr { display:none; }

而在你的HTML/PHP文件：

<table> 
    <tr> 
     <th>Name</th> 
     <th>Address</th> 
    </tr> 
    <tbody class="hide-row"> 
    <?php foreach($cops as $row) { ?> 
     <tr> 
      <td><?php echo $row->name; ?></td> 
      <td><?php echo $row->address; ?></td> 
     </tr> 
    <?php } ?> 
    </tbody> 
</table>

來源

2013-03-27 09:15:45 jantimon

謝謝Jantimon，它完美的工作。我選擇第二個選項。實際上，當用戶點擊與迭代有關的內容時，我希望通過Jquery的平滑切換來顯示它。 - ） – 2013-03-27 09:57:41

不能嵌套一個div直接在table標籤內。你必須給你的行上課，然後隱藏它。喜歡的東西：

.hidden { 
    display: none; 
} 

<?php foreach($cops as $row) { ?> 
    <tr class="hidden"> 
     <td><?php echo $row->name; ?></td> 
     <td><?php echo $row->address; ?></td> 
    </tr> 
<?php } ?>

來源

2013-03-27 09:16:50 mattytommo

你不能有<div>外<tr> ..給類<tr>和隱藏that..no需要創建一個圍繞它<div>

HTML

<tr class="hide-row"> 
     <td><?php echo $row->name; ?></td> 
     <td><?php echo $row->address; ?></td> 
    </tr>

style.css

.hide-row { display:none; }

來源

2013-03-27 09:16:57 bipen

我會給你想要隱藏一個hide-row類的每一行：然後

<tr class="hide-row">

你的CSS看起來像：

tr.hide-row { display: none; }

這就意味着你不需要div嵌套。

來源

2013-03-27 09:17:21 James

您不能將div作爲<表>元素的直接子元素。要隱藏單行請參閱jantimon的答案。如果您希望將多個行使用< TBODY>：

CSS

.hide-row { display:none; }

PHP

<table> 
    <tr> 
     <th>Name</th> 
     <th>Address</th> 
    </tr> 
    <tbody class="hide-row"> 
     <?php foreach($cops as $row) { ?> 
      <tr> 
       <td><?php echo $row->name; ?></td> 
       <td><?php echo $row->address; ?></td> 
      </tr> 
     <?php } ?> 
    </tbody> 
</table>

來源

2013-03-27 09:20:35 martijnve

對於「表格」（或「tbody」或「thead」或「tfoot」）的無子對象+1。後裔，是的，如果中間有'tr'（我編輯了你的答案，以反映你可以在表格中使用div，但在'tr> td'或'tr> th'中） – FelipeAls 2013-03-27 09:22:12

隱藏表格行使用CSS

回答

相關問題