テーブルとは何ですか? HTML のテーブルの概要

<table>
	<caption>表格标题</caption>
    <tr>
        <th>1行1列的内容</th>
        <th>1行2列的内容</th>
        …
    </tr>
    <tr>
        <td>2行1列的内容</td>
        <td>2行2列的内容</td>
        …
    </tr>
    …
</table>

注: th と td :th の違いは、デフォルトで太字で中央揃えでセルに表示されます。

1. 境界線ラベル属性: 境界線属性は、各セルに境界線を追加し、境界線でテーブルを囲みます。 border 属性 値が変更されると、テーブルの周囲の境界線のサイズのみが変更され、テーブル内の境界線の幅は 1 ピクセルになります。境界線の設定には、border style 属性を使用することをお勧めします。ボーダーを設定するには、border タグ属性を使用します。

2. width タグ属性: 設定 テーブルの幅を決定するには、width スタイル属性を使用してテーブルの幅を設定することをお勧めします。幅を設定する属性。このタグ属性には複数の値があります:

value。 説明する 左 表を左揃えにします。 右 テーブルを右に揃えます。 中心 テーブルを中央揃えにします。

tr label 属性

左 コンテンツを左揃えにします (デフォルト)。 右 コンテンツを右揃えにします。 中心 コンテンツを中央揃えにします。 正当化する (新聞や雑誌のように) 各行が同じ長さになるように行を引き伸ばします。 チャー コンテンツを指定した文字に揃えます。注: ブラウザはこのタグの属性値をサポートしていません。

2. bgcolor ラベル属性: テーブル行の背景色を設定します。この効果を実現するには、background-color スタイル属性を使用することをお勧めします:

value。 説明する 色名 カラー値がカラー名の背景色 (「red」など) であることを指定します。 hex_number 背景色を 16 進数値で指定します (「#ff0000」など)。 rgb_number RGB コードで背景色として色の値を指定します (例: "rgb(255,0,0)")。

3. valign label 属性: テーブル行のセルの内容の垂直方向の配置を設定します。この label 属性には複数の値があります:

値。 説明する 上 コンテンツの上端を揃えます。 真ん中 コンテンツを中央揃えにします (デフォルト)。 底 コンテンツを下に揃えます。 ベースライン ベースラインに合わせます。

th および td ラベル属性

1. align label 属性: セルの内容の水平方向の配置を設定します。この label 属性には複数の値があります:

値。 説明する 左 コンテンツを左揃えにします (td タグのデフォルト)。 右 コンテンツを右揃えにします。 中心 コンテンツを中央揃えにします (タグのデフォルト)。 正当化する (新聞や雑誌のように) 各行が同じ長さになるように行を引き伸ばします。 チャー コンテンツを指定した文字に揃えます。注: ブラウザはこのタグの属性値をサポートしていません。

2. bgcolor ラベル属性: セルの背景色を設定します。この効果を実現するには、background-color スタイル属性を使用することをお勧めします:

value。 説明する 色名 カラー値がカラー名の背景色 (「red」など) であることを指定します。 hex_number 背景色を 16 進数値で指定します (「#ff0000」など)。 rgb_number RGB コードで背景色として色の値を指定します (例: "rgb(255,0,0)")。

3. valign label 属性: セルの内容の垂直方向の配置を設定します。この label 属性には複数の値があります:

top コンテンツの上端を揃えます。 真ん中 コンテンツを中央揃えにします (デフォルト)。 底 コンテンツを下に揃えます。 ベースライン ベースラインに合わせます。

4. width ラベル属性と高さラベル属性: セルの幅と高さを設定するには、width スタイル属性と高さスタイル属性を使用することをお勧めします。高さラベル属性の設定。このラベル属性には複数の値があります:

value 説明する ピクセル ピクセル単位の幅または高さの値 (「100px」など)。 パーセント 含まれる要素のパーセンテージとしての幅または高さの値 (「20%」など)。

5. nowrap ラベル属性: セルのコンテンツを折り返すかどうかを設定します

6.colspan ラベル属性と rowspan ラベル属性: セルがまたがる列数と行数をそれぞれ設定します

関連する推奨事項:

HTMLの小さなタグは何を意味しますか? smallタグの使用例