<tr>


HTML <tr> タグ

インスタンス

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>

<table border="1">
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td>0</td>
  </tr>
  <tr>
    <td>February</td>
    <td></td>
  </tr>
</table>

</body>
</html>

インスタンスの実行»

オンラインの例を表示するには、[インスタンスの実行] ボタンをクリックしてください

ブラウザのサポート

1000.png

すべての主要ブラウザ すべて<tr> タグをサポートします。

タグの定義と使用方法

<tr> タグは HTML テーブルの行を定義します。

要素には 1 つ以上の 要素が含まれます。

HTML 4.01 と HTML5 の違い

HTML 5 では、HTML 4.01 の <tr> タグの属性はサポートされていません。 attribute

Attributevaluedescriptionlignlightleftcenterhtml5サポートされていません。 colornameHTML5 はサポートされていません。 HTML 4.01 は非推奨になりました。 HTML5 はサポートされていません。 HTML5 はサポートされていません。 baselineテーブル行のコンテンツの垂直方向の配置を指定します。
justifyテーブル行のコンテンツの配置を定義します。



bgcolor		rgb(x,x,x)#xxxxxx
テーブル行の背景色を指定します。

char		character
テキストの配置に使用する文字を指定します。 charoffnumber
最初に位置合わせされた文字のオフセットを指定します。 valigntopmiddlebottom
HTML5はサポートされていません。



グローバル属性

<tr> タグは HTML グローバル属性をサポートします。

イベント属性

<tr> タグは HTML イベント属性をサポートします。

試してみる - 例

テーブルのタイトル
この例は、テーブルのタイトルを表示する方法を示します。

インスタンス

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>

<h4>表格使用水平标题:</h4>
<table border="1">
  <tr>
    <th>Name</th>
    <th>Telephone</th>
  </tr>
  <tr>
    <td>Bill Gates</td>
    <td>555 77 854</td>
  </tr>
</table>

<h4>表格使用垂直标题:</h4>
<table border="1">
  <tr>
    <th>First Name:</th>
    <td>Bill Gates</td>
  </tr>
  <tr>
    <th>Telephone:</th>
    <td>555 77 854</td>
  </tr>
</table>

</body>
</html>

インスタンスの実行 »

「インスタンスの実行」ボタンをクリックしてオンラインインスタンスを表示します

空のセル
この例では、「 」を使用してコンテンツのないセルを処理する方法を示します。

インスタンス

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>

<table border="1">
<tr>
  <td>一些文本</td>
  <td>一些文本</td>
</tr>
<tr>
  <td></td>
  <td>一些文本</td>
</tr>
</table>

<p>如果在上面的空单元格中没有边框，你可以插入一个空格 ： &nbsp;</p>

</body>
</html>

インスタンスの実行 »

「インスタンスの実行」ボタンをクリックしてオンラインインスタンスを表示します

タイトル付きの表
この例は、キャプション付きの表を示しています。

例

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>

<table border="1">
  <caption>Monthly savings</caption>
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td>0</td>
  </tr>
  <tr>
    <td>February</td>
    <td></td>
  </tr>
</table>

</body>
</html>

例の実行 »

オンライン例を表示するには、[例の実行]ボタンをクリックしてください

テーブル内のラベル
この例は、他の要素内に要素を表示する方法を示します。

インスタンス

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>

<table border="1">
  <caption>Monthly savings</caption>
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td>0</td>
  </tr>
  <tr>
    <td>February</td>
    <td></td>
  </tr>
</table>

</body>
</html>

インスタンスの実行»

オンラインインスタンスを表示するには、[インスタンスの実行]ボタンをクリックしてください

行または列にわたる表のセル

この例では、行または列にわたる表のセルを定義する方法を示します。 。

インスタンス

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
</head>
<body>

<h4>单元格跨两格:</h4>
<table border="1">
<tr>
  <th>Name</th>
  <th colspan="2">Telephone</th>
</tr>
<tr>
  <td>Bill Gates</td>
  <td>555 77 854</td>
  <td>555 77 855</td>
</tr>
</table>

<h4>单元格跨两列:</h4>
<table border="1">
<tr>
  <th>First Name:</th>
  <td>Bill Gates</td>
</tr>
<tr>
  <th rowspan="2">Telephone:</th>
  <td>555 77 854</td>
</tr>
<tr>
  <td>555 77 855</td>
</tr>
</table>

</body>
</html>

インスタンスの実行 »

「インスタンスの実行」ボタンをクリックしてオンラインインスタンスを表示します

関連記事

HTMLチュートリアル: HTMLテーブル

HTML DOMリファレンスマニュアル: TRオブジェクト

←
→

PHP中国語ウェブサイト

ホームページホームページコースコース記事記事に質問に質問辞書辞書マニュアルマニュアルダウンロードダウンロード検索検索APPダウンロード APPダウンロード