CSS の空のセルに関する問題-CSSチュートリアル-php.cn

CSS の空のセルに関する問題

黄舟

リリース： 2017-06-30 13:25:48

オリジナル

1509 人が閲覧しました

CSSでborder-collapseを分離するように設定した場合、empty-cellsであっても結果は同じで、表示値と非表示値も同じであることがわかりました。教えていただければ幸いです。いくつかのアドバイス。

css2標準の
構文:

empty-cells : show | hide

ログイン後にコピー

値:
show : デフォルト値。境界線を表示
hide : 境界線を非表示にする

説明:
テーブルのセルに内容がない場合にセルの境界線を表示するかどうかを設定または取得します。このプロパティは、テーブルの行と列の境界線が独立している場合にのみ機能します (例: border-collapse
プロパティが Separate に等しい場合)。対応するスクリプト機能は emptyCells です。

これはIEではサポートされていないCSS2標準ですが、Firefoxでは普通にエフェクトを表示できます

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>table test</title>
<style>
#layout {}
.show {border: 1px solid #ff0000; border-collapse:separate; empty-cells: show;}
.hide {border: 1px solid #ff0000; border-collapse:separate; empty-cells: hide;}
</style>
</head>

<body>
<table id="layout">
  <tr>
    <td class="show">Cascading</td>
    <td class="show"></td>
  </tr>
  <tr>
    <td class="hide">Cascading</td>
    <td class="hide"></td>
  </tr>
 </table>
</body>
</html>

ログイン後にコピー

表示すると空のテーブルが表示されるのがわかります。隠れるときは隠れます

。

以上がCSS の空のセルに関する問題の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。