CSS のテーブルに関する関連紹介

テーブルの境界線

border属性を使用してCSSテーブルの境界線を指定します。

次の例では、テーブルの Th 要素と TD 要素に黒い枠線を指定しています。

例

table, th, td{border: 1px solid black;}

上記の例では、テーブルに二重枠があることに注意してください。これは、table 要素と th/td 要素に別々の境界があるためです。

表の単一の境界線を表示するには、border-collapse プロパティを使用します。

境界線を折りたたむ

border-collapse プロパティは、テーブルの境界線を単一の境界線に折りたたむか、間隔をあけて配置するかを設定します:

例

table{border-collapse:collapse;}table,th, td{border: 1px solid black;}

テーブルの幅と高さ

Width プロパティと height プロパティは、テーブルの幅と高さを定義しますテーブル。

次の例は、幅 100%、番目の要素の高さを 50 ピクセルに設定するテーブルです:

例

table 
{
width:100%;
}
th
{
height:50px;
}

表のテキスト配置

テーブル内のテキスト配置と垂直配置のプロパティ。

text-align プロパティは、左、右、中央などの水平方向の配置を設定します:

インスタンス

td{text-align:right;}

vertical-align プロパティは、上、下、中央などの垂直方向の配置を設定します:

インスタンス

td
{
height:50px;
vertical-align:bottom;
}

table-filling

if テーブルのコンテンツ内のスペース間の境界線を制御するには、 td 要素と th 要素の padding 属性を使用する必要があります:

例

td
{
padding:15px;
}

テーブルの色

次の例では、境界線の色を指定します。番目の要素のテキストと背景の色:

例

table, td, th{border:1px solid green;}th{background-color:green;color:white;}

[関連する推奨事項]

1. 特別な推奨事項: 「php プログラマー ツールボックス」V0.1 バージョンのダウンロード

2.オンラインビデオチュートリアル

php.cn Dugu Jiijian (2) - CSS ビデオチュートリアル

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