ホームページ > 記事 > ウェブフロントエンド > HTML5におけるテーブルの意味
HTML5におけるテーブルの意味
- 醉折花枝作酒筹オリジナル
- 2021-06-07 11:17:077831ブラウズ
HTML では、table はテーブルであり、構文形式は「
table content
」です。単純な HTML テーブルには、table 要素、1 つ以上の tr、th、および td 要素が含まれます。tr 要素はテーブルの行を定義し、th 要素はヘッダーを定義し、td 要素はテーブルのセルを定義します。
このチュートリアルの動作環境: Windows 7 システム、CSS3&HTML5 バージョン、Dell G3 コンピューター。
単純な HTML テーブルは、table タグと 1 つ以上の tr、th、td 要素で構成されます。
table タグ
-
table タグは、単純なテーブルを定義できます。主にテーブルの外枠を制御するために使用されます。マージン属性があります。主にテーブルの外側の境界線を設定するために使用されます。 border 属性はテーブルの境界線を設定するために使用され、cellspacing 属性はセル間の空白スペースを指定するために使用されます。
tr は、テーブル内の複数の行を分割するために使用されるメインの部分です。通常、高さを設定するためにのみ使用する必要があります。
- td は制御に使用されます。各セルの属性は、各セルの上下左右の境界線をそれぞれ制御できます。これにはパディング属性も含まれます。
- th の使用法は、テーブルのヘッダーを区別するために使用されることを除いて、td の使用法と同じです。
#注: 表内の単位としてパーセンテージを使用することとピクセルを使用することは同じです。
#例:<!DOCTYPE html>
<html>
<head>
<title>test</title>
</head>
<body>
<table border="1">
<tr>
<th>NAME</th>
<th>AGE</th>
<th>NUMBER</th>
</tr>
<tr>
<td>xm</td>
<td>10</td>
<td>2020</td>
</tr>
<tr>
<td>xh</td>
<td>3</td>
<td>2021</td>
</tr>
<tr>
<td>xf</td>
<td>4</td>
<td>2010</td>
</tr>
</table>
</body>
</html>テーブルの行間および列間処理
セルのcolspan属性を設定して列間で結合したり、セルのrowspan属性を設定したりすることもできます。以下に示すように、セルを結合します。
例:
<!DOCTYPE html>
<html>
<head>
<title>test</title>
</head>
<body>
<table border="1">
<tr>
<th>NAME</th>
<th>AGE</th>
<th>NUMBER</th>
</tr>
<tr>
<td rowspan="2">xm</td>
<td>10</td>
<td>2020</td>
</tr>
<tr>
<td>3</td>
<td>2021</td>
</tr>
<tr>
<td>xf</td>
<td>4</td>
<td>2010</td>
</tr>
</table>
</body>
</html>結果:
#推奨される学習:
htmlビデオチュートリアル#
以上がHTML5におけるテーブルの意味の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
前の記事：HTMLの境界線の隙間を取り除く方法次の記事：HTMLの境界線の隙間を取り除く方法