HTML テーブル境界コントロールの詳細な説明

HTML テーブル境界コントロールの詳細な説明
上の境界線のみを表示する <table frame=above>
下の境界線のみを表示する <table frame=below>
左と右の境界線のみを表示する <table frame=vsides>
上と下の境界線のみを表示します <table frame=hsides>
左の境界線のみを表示する <table frame=lhs>
右の境界線のみを表示する <table frame=rhs>
境界線を表示しない <table frame=void>

コードをコピー
コードは次のとおりです。

<html>
<ヘッド>
<title>表の境界線を非表示</title>
<meta http-equiv="コンテンツタイプ" コンテンツ="text/html; charset=utf-8">
<スタイル タイプ="text/css">
本文 { 色:"#ffffff";
フォントファミリー: "宋体";
フォントサイズ: 12px;
上マージン: 4;
}
.t {
境界線: #000000; 境界線スタイル: solid; 境界線幅: 1px
}
td {
フォント ファミリ: "Tahoma"、"MS Shell Dlg"、フォント サイズ: 12px
}
テキストエリア {境界線: 1 実線 #000000"}
</スタイル>
</head>
<body bgcolor="#999999" テキスト="#000000">
<中央>
<テーブルの幅="600" 境界線="0" セル間隔="0" セルパディング="8" クラス="t">
<tr>
<td>
<表の境界線="1" 幅="200" セルパディング="0" セル間隔="0">
<tr align="center">
<td>公開</td>
<td>表</td>
</tr>
<tr align="center">
<td>合格</td>
<td>グリッド</td>
</tr>
</テーブル>
</td>
<td>これは通常のテーブルです</td>
</tr>
<tr>
<td>

<テーブルの幅="200" 境界線="1" セル間隔="0" セルパディング="0" フレーム=上>
<tr align="center">
<td>頭</td>
<td>トップ</td>
</tr>
<tr align="center">
<td>はい</td>
<td>日</td>
</tr>
</テーブル>

</td>
<td>上の境界線のみ表示</td>
</tr>
<tr>
<td>
<テーブルの幅="200" 境界線="1" セル間隔="0" セルパディング="0" フレーム=下>
<tr>
<td align="center">足</td>
<td align="center">次へ</td>
</tr>
<tr>
<td align="center">はい</td>
<td align="center">地面</td>
</tr>
</テーブル>
</td>
<td>下の境界線のみを表示する</td>
</tr>
<tr>
<td>

<テーブル幅="200" 境界線="1" セル間隔="0" セルパディング="0" フレーム=vsides>
<tr>
<td align="center">空に届く方法はありません</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td align="center">地面に触れない</td>
</tr>
</テーブル>

</td>
<td>左と右の境界線のみを表示する</td>
</tr>
<tr>
<td>
<表の境界線="1" セル間隔="0" セルパディング="0" フレーム=hsides width="200">
<tr>
<td align="center">両側を削除します</td>
<td></td>
</tr>
<tr>
<td></td>
<td align="center">「王」という文字だけが残ります</td>
</tr>
</テーブル>
</td>
<td>上と下の境界線のみを表示する</td>
</tr>
<tr>
<td>

<テーブルの幅="200" 境界線="1" セル間隔="0" セルパディング="0" フレーム=lhs>
<tr>
<td width="100" align="center">のみ</td>
<td width="100" align="center">はい</td>
</tr>
<tr>
<td align="center">左</td>
<td align="center">サイド</td>
</tr>
</テーブル>

</td>
<td>左の境界線のみを表示する</td>
</tr>
<tr>
<td>
<テーブルの幅="200" 境界線="1" セル間隔="0" セルパディング="0" フレーム=rhs>
<tr>
<td width="100" align="center">のみ</td>
<td width="100" align="center">はい</td>
</tr>
<tr>
<td align="center">右</td>
<td align="center">サイド</td>
</tr>
</テーブル>
</td>
<td>右の境界線のみを表示する</td>
</tr>
<tr>
<td>

<テーブルの幅="200" 境界線="1" セル間隔="0" セルパディング="0" フレーム=void>
<tr>
<td align="center">周辺</td>
<td align="center">削除</td>
</tr>
<tr>
<td align="center">のみ</td>
<td align="center">中央</td>
</tr>
</テーブル>
</td>
<td>境界線を表示しない</td>
</tr>
<tr>
<td colspan="2">
<hr size="1" color=黒>
テーブル境界線の表示と非表示は、frame パラメータによって制御できます。これはテーブルの境界線の画像のみを制御し、セルには影響しないことに注意してください。

上の境界線のみを表示します &lt;table frame=above&gt;

下の境界線のみを表示します &lt;table frame=below&gt;

左と右の境界線のみを表示します &lt;table frame=vsides&gt;

上部と下部の境界線のみを表示します &lt;table frame=hsides&gt;

左の境界線のみを表示します &lt;table frame=lhs&gt;

右の境界線のみを表示します &lt;table frame=rhs&gt;

境界線を表示しない&lt;table frame=void&gt;</td>
</tr>
</テーブル>
</center>
</本文>
</html>

<<:  熟練デザイナーの7つの原則(2):色の使い方

>>:  CSS リセットスタイルリセットの実装例

推薦する

JavaScriptプロトタイプチェーンの詳細な説明

目次1. コンストラクタとインスタンス2. プロパティプロトタイプ3. プロパティ __proto_...

div 要素に終了タグがないため、Web ページを開くことができません

最初は速度の問題だと思ったので、その後、すべての画像リンク リクエストをクロスサイト接続ではなくサイ...

Vueはシンプルな計算機を実装する

この記事では、参考までに、Vue の具体的なコードで簡単な計算機を実装する方法を紹介します。具体的な...

マウスを置いたときに半透明効果のテキスト説明を実現するための純粋な CSS (初心者は必読)

効果は以下のとおりです。 例1 例2:例1[結婚式の計画]を例にとるHTML: <div cl...

Tomcat クラスローダーの実装方法とサンプルコード

Tomcat は内部的に複数の ClassLoader を定義し、アプリケーションとコンテナーが異な...

Linux DockerでSpringbootプロジェクトを実行するための詳細な手順

導入: springboot プロジェクトを実行する Docker の構成は実は非常にシンプルで、L...

近々ブラウザに導入される CSS :is() と :where() の簡単な分析

Safari (Technology Preview 106) および Firefox (バージョン...

Node.jsはブレークポイント再開を実装する

目次ソリューション分析スライス履歴書のダウンロード具体的な解決プロセス論理的分析フロントエンドサーバ...

Vueはechartsを使用して組織図を描画します

昨日、円形のプログレスバー (Vue 円形プログレスバーを参照してください) についてブログを書きま...

MySQL スケジュールタスクの実装と使用例

この記事では、例を使用して、MySQL スケジュール タスクの実装と使用方法を説明します。ご参考まで...

複数サーバーの負荷分散を実現するためのNginx構成

Nginx ロード バランシング サーバー: IP: 192.168.0.4 (Nginx-Serv...

Centos8でdockerがインストールできない問題の解決方法

問題 [root@zh ~]# [root@zh ~]# [root@zh ~]# yum -y d...

Docker基盤技術の適用に関する詳細な説明 名前空間Cgroup

Docker の基盤技術: Docker の基盤となる 2 つのコア テクノロジーは、名前空間とコ...

Tomcat9 のダウンロード、インストール、設定 + Eclipse への統合に関する詳細なチュートリアル

トムキャット公式サイトtomcatはローカルサーバーと同等であり、Webページを開くことができます設...

CSS3はトランジション効果を実現するためにtransitionプロパティを使用する。

物件の詳細な説明transition 属性の目的は、一部の CSS プロパティ (背景など) をスム...