5

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>

しかし、それは機能しませんでした、レコードはまだ表示されます。誰かがこのケースを解決する方法を助けますか？どんな助けでもありがたいです。アドバンストありがとうございます！

4

5 に答える 5

10

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。

同じ<テーブル>に複数の<tbody>を含めることはできますか？

 .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-27T09:15:45.237 に答える
3

<table>要素の直接の子として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-27T09:20:35.260 に答える
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 } ?>
于 2013-03-27T09:16:50.610 に答える
2

あなたは<div>外にいることはできません<tr>..クラスを与えて<tr>それを隠す..それの<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-27T09:16:57.347 に答える
2

非表示にする各行にhide-rowクラスを指定します。

<tr class="hide-row">

CSSは次のようになります。

tr.hide-row { display: none; }

これは、ネストされたdivが必要ないことを意味します。

于 2013-03-27T09:17:21.340 に答える