ホームページ  >  記事  >  ウェブフロントエンド  >  ブートストラップを使用して表内のテキストを整列するにはどうすればよいですか?

ブートストラップを使用して表内のテキストを整列するにはどうすればよいですか?

Patricia Arquette
Patricia Arquetteオリジナル
2024-11-01 12:01:02804ブラウズ

How do I align text in tables using Bootstrap?

ブートストラップのテキスト配置クラス

ブートストラップでは、表内のテキストを配置するために使用できるさまざまなテキスト配置クラスがあります。

ブートストラップ 3

  • text-left: テキストを左揃えにします。
  • text-center: テキストを水平方向に中央揃えにします。
  • text- right: テキストを右に揃えます。
  • text-justify: 全幅にわたってテキストを両端揃えにします。
  • text-nowrap: テキストの折り返しを防ぎます。

例:

<code class="html"><th class="text-right">Total</th>
<td>,000,000.00</td></code>

Bootstrap 4

Bootstrap 3 と同様に、Bootstrap 4 もテキスト配置クラスを提供します:

  • text-xs-left : すべてのビューポート サイズでテキストを左揃えにします。
  • text-xs-center: すべてのビューポート サイズでテキストを中央揃えにします。
  • text-xs-right: すべてのビューポート サイズでテキストを右揃えにします。
  • さらに、text-sm-left、text-md-left、text-lg-left、および text-xl-left は、特定のビューポート サイズの左揃えを指定します (例: 小の場合は sm、中程度の場合は md)

Bootstrap 5

Bootstrap 5 では、text-left が text-start に置き換えられ、text-right が置き換えられました。テキストエンド付き。それ以外の場合、テキスト配置クラスは同じままです。

以上がブートストラップを使用して表内のテキストを整列するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。