Скрыть таблицу строк с помощью CSS

Question

Можно ли скрыть таблицы строк с помощью 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> 

Но это не сработало, записи по-прежнему появляются. Кто-нибудь поможет решить этот вопрос? Любая помощь будет оценена по достоинству. Заранее благодарю !

Answer 1

Используйте класс вместо 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> 

Answer 2

Вы не можете вкладывать 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 } ?> 

Answer 3

вы не можете иметь <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; } 

Answer 4

Я дал бы каждую строку вы хотите скрыли hide-row класс:

<tr class="hide-row"> 

Ваш CSS будет выглядеть:

tr.hide-row { display: none; } 

Это то означает, что вам не нужно вложенную DIV.

Answer 5

Вы не можете поместить divs как прямые дочерние элементы таблицы <. Чтобы скрыть отдельные строки, см. Ответ 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>