CSS テーブルの配置
水平方向の配置
text-align
プロパティは、<th>または<td>のコンテンツの水平方向の配置(左、右、中央など)を設定します。
デフォルトでは、<th>要素のコンテンツは中央揃えで、<td>要素のコンテンツは左揃えです。
<td>要素のコンテンツも中央揃えにするには、text-align: center
を使用します。
ファーストネーム | ラストネーム | 貯金 |
---|---|---|
ピーター | グリフィン | $100 |
ロイス | グリフィン | $150 |
ジョー | スワンソン | $300 |
コンテンツを左揃えにするには、 text-align: left
プロパティを使用して、<th>要素の配置を左揃えにします。
ファーストネーム | ラストネーム | 貯金 |
---|---|---|
ピーター | グリフィン | $100 |
ロイス | グリフィン | $150 |
ジョー | スワンソン | $300 |
垂直方向の配置
vertical-align
プロパティは、<th>または<td>のコンテンツの垂直方向の配置(上、下、中央など)を設定します。
デフォルトでは、テーブル内のコンテンツの垂直方向の配置は中央です(<th>要素と<td>要素の両方)。
次の例では、 <td>要素の垂直方向のテキスト配置を下に設定します。
ファーストネーム | ラストネーム | 貯金 |
---|---|---|
ピーター | グリフィン | $100 |
ロイス | グリフィン | $150 |
ジョー | スワンソン | $300 |
プログラミング学習を加速させる
プログラミングをプロの講師に教えてもらいませんか。