HTML テーブルインライン形式の詳細な説明

HTML テーブルインライン形式の詳細な説明

インライン形式

<colgroup>...</colgroup>

属性名 属性値 説明

左揃え
中心
右
ヴァリントップ
真ん中
底
スパン番号 インライン番号

bgcolor 色 背景色

個別のインライン設定

フォーマット: <col> は <colgroup> と同じ機能を持ちます

<!-- 最初の行の DOCTYPE を xhtml に設定すると、colgroup が失敗することに注意してください -->

XML/HTML コードコンテンツをクリップボードにコピー
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >   
  2.   
  3. < html   xmlns = "http://www.w3.org/1999/xhtml" >   
  4. <ヘッド>   
  5.      < title >表のインライン形式</ title >   
  6. </ヘッド>   
  7. <本文>   
  8.      <表 セルパディング= "5px"  セル間隔= "0px"  境界線= "1px"  境界線の色= "黒" >   
  9. <!--説明: 2セットのcolgroupタグを使用して、3列目全体を赤で表示するように制御します。
  10. 最初の colgroup のspan = "2"はプレースホルダーに相当するため、3 番目の列 (数学列全体) は赤で表示されます。
  11. 同様に、 span = "3"を設定すると、4 列目 (英語の列全体) が赤で表示されます。
  12.              <列グループ  span = "2" > </ colgroup >   
  13.              <コルグループ  bgcolor = "赤" > </ colgroup >   
  14. -- >   
  15. <!-- < col > は< colgroup >と同じ機能を持ちます
  16. <col>タグを設定すると、 <colgroup>と同じ機能を実現できます。
  17. ここで、 align = "right"を追加して、3 番目の列 (数式列全体) を右揃えに設定します。
  18. -- >   
  19.          <列 スパン= "2"   />   
  20.          <列  bgcolor = "赤"   align = "右"   />   
  21.          <キャプション  align = "left" >生徒の成績表</ caption >   
  22.          < tr >   
  23.              < th >名前</ th >   
  24.              < th >中国語</ th >   
  25.              < th >数学</ th >   
  26.              < th >英語</ th >   
  27.          </tr>​​   
  28.          < tr >   
  29.              < td >張三</ td >   
  30.              < td > 90 </ td >   
  31.              < td > 89 </ td >   
  32.              < td > 99 </ td >   
  33.          </tr>​​   
  34.          < tr >   
  35.              < td >李思</ td >   
  36.              < td > 98 </ td >   
  37.              < td > 92 </ td >   
  38.              < td > 96 </ td >   
  39.          </tr>​​   
  40.          < tr >   
  41.              < td >王武</ td >   
  42.              < td > 92 </ td >   
  43.              < td > 97 </ td >   
  44.              < td > 91 </ td >   
  45.          </tr>​​   
  46.          < tr >   
  47.              < td >合計スコア</ td >   
  48.              < td > 200 </ td >   
  49.              < td > 200 </ td >   
  50.              < td > 200 </ td >   
  51.          </tr>​​   
  52.      </表>   
  53. </本文>   
  54. </html>​​   

以上がエディターがお届けするHTMLテーブルインラインフォーマットの詳細な説明の内容です。お役に立てれば幸いです。123WORDPRESS.COMを応援してくださいね～

<<:  ウェブページの右側に固定されたフローティングレイヤーの実装コード

>>:  CentOS に MySQL 5.5 をインストールするための完全な手順

推薦する

Linux システムで Vim を使用してリモート ファイルを読み書きするコマンドの詳細な説明

vim の動作モードを設定する (一時的) :set (モード情報) :set nu — 行番号を表...

OEL7.6 ソースコードから MYSQL5.7 をインストールするチュートリアル

まず、公式サイト https://dev.mysql.com/downloads/mysql/5.7...

React と Threejs を使用して VR パノラマ プロジェクトを作成する詳細なプロセス

最近、 Three.jsでReactを使用して、720 度のパノラマ写真を閲覧できるプロジェクトを構...

HTML要素にフォーカスを設定する方法

コードをコピーコードは次のとおりです。 <本文<フォームアクション="&quo...

Linux で特定の時間にコマンドを実行する方法

先日、rsync を使用して LAN 上の別のシステムに大きなファイルを転送していました。非常に大き...

HTML ウェブページの基本コンポーネントの概要

<br />Web ページ上の情報は主にテキストベースです。 Web ページでは、フォン...

変換を使用して純粋な CSS ポップアップ メニューを実装するためのサンプル コード

序文トップメニューを作成する場合、ポップアップのセカンダリメニューを作成する必要があります。 以前の...

Fabric.js は DIY ポストカード機能を実装します

この記事では、DIYポストカード機能を実現するためのfabricjsの具体的なコードを参考までに共有...

mysql ダーティ ページとは何ですか?

目次ダーティページ（メモリページ）ダーティページが表示されるのはなぜですか?メモリ管理メカニズムの簡...

MySQL Community Server 5.7.19 インストール ガイド (詳細)

MySQL公式サイトのzipファイルのダウンロードリンク https://dev.mysql.co...

MySQL 上級学習インデックスの長所と短所、使用ルール

1. インデックスの利点と欠点利点: 高速検索、高速グループ化および並べ替えデメリット: ストレージ...

mysqlのデータディレクトリ内のファイルを直接コピーしてデータを復元する実装

mysqlはデータディレクトリ内のファイルをコピーしてデータを復元します背景: MySQL がクラッ...

Node+socketでシンプルなチャットルーム機能を実現

この記事では、参考までに、シンプルなチャットルームを実装するためのnode+socketの具体的なコ...

MySQL バージョンは、2 つのタイムスタンプ型の値をサポートしていないバージョンよりも低いです。

MySQL エラー:エラー コード: 1293 テーブル定義が正しくありません。CURRENT_T...

行間隔が広い場合の解決策（IE では 5 ピクセル多い）

コードをコピーコードは次のとおりです。 li {幅:300px; 高さ:23px; 行の高さ:24p...