HTML テーブルの内容を中央揃えにするにはどうすればよいですか?

HTML テーブルの内容を中央揃えにする

HTML テーブルを操作する場合、セルの内容を垂直方向と水平方向に整列させる必要がある場合があります。より視覚的に魅力的な結果が得られます。これを実現する方法は次のとおりです:

テキストを水平方向および垂直方向に中央揃えにする

• インライン スタイル属性: text-align プロパティを使用して中央揃えにしますテキストを水平方向に配置し、垂直方向に配置して垂直方向に配置します。例:

<code class="html"><td style="text-align: center; vertical-align: middle;">Text</td></code>

• CSS ルール: すべての表セルのテキストを中央揃えにする CSS ルールを定義します:

<code class="css">td {
    text-align: center;
    vertical-align: middle;
}</code>

以下は両方のアプローチを示す例です:

<code class="html"><table>
<tr>
    <td style="text-align: center; vertical-align: middle;">Centered Cell</td>
    <td style="text-align: center; vertical-align: middle;">Centered Cell</td>
</tr>
</table>

<table border="1" id="cssTable">
<tr>
    <td>Centered Cell</td>
    <td>Centered Cell</td>
</tr>
</table></code>

<code class="css">#cssTable td {
    text-align: center;
    vertical-align: middle;
}</code>

これらのテクニックを使用すると、HTML テーブルのコンテンツを簡単に中央に配置でき、よりユーザーフレンドリーで視覚的に魅力的なインターフェースが得られます。

以上がHTML テーブルの内容を中央揃えにするにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。