CSSでtrを設定する方法

CSS 設定 <tr> 要素

HTML テーブルでは、<tr> 要素はテーブルの行を定義します。 CSS を使用して、背景色、境界線、配置などの <tr> 要素のスタイルを設定できます。

1. 背景色の設定

background-color 属性を使用して、<tr>## の背景色を設定します。 ＃ 要素。例を次に示します。

tr {
  background-color: yellow;
}

これにより、すべての

<tr> 要素の背景色が黄色になります。

境界線の設定

border 属性を使用して、<tr> 要素の境界線を設定します。例を次に示します。

tr {
  border: 1px solid black;
}

これにより、すべての

<tr> 要素に 1 ピクセルの太さの黒い実線の境界線が追加されます。

配置の設定

text-align 属性を使用して、<tr> 要素の水平方向の配置を設定します。 。例を次に示します。

tr {
  text-align: center;
}

これにより、すべての

<tr> 要素のコンテンツが水平方向に中央揃えになります。

vertical-align 属性を使用して、<tr> 要素の垂直方向の配置を設定します。例を次に示します。

tr {
  vertical-align: middle;
}

これにより、すべての

<tr> 要素のコンテンツが垂直方向に中央揃えになります。

フォント スタイルと色の設定

color 属性を使用して、<tr> のフォントの色を設定します。要素。例を次に示します。

tr {
  color: blue;
}

これにより、すべての

<tr> 要素のテキストが青色になります。

font-family 属性と font-size 属性を使用して、<tr> 要素のテキストのフォントとサイズを設定します。 。例を次に示します。

tr {
  font-family: Arial;
  font-size: 14px;
}

これにより、すべての

<tr> 要素のテキストのフォントが Arial になり、フォント サイズが 14px になります。

他のスタイルの設定

CSS を使用すると、高さ、行間隔、などの

<tr> 要素の他のスタイルを設定することもできます。等以下に例をいくつか示します。

tr {
  height: 50px; /* 设置行高为 50 像素 */
  line-height: 50px; /* 设置行距为 50 像素 */
  padding: 10px;  /* 设置内边距为 10 像素 */
}

上記は、CSS 設定の

<tr> 要素の一般的なスタイルの一部です。実際のアプリケーションでは、必要に応じて各 <tr> 要素を個別に設定することも、すべての <tr> 要素にクラス名を追加してまとめてスタイルを設定することもできます。

以上がCSSでtrを設定する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。