HTMLテキストの中央揃えを設定する方法

方法: 1. ラベルの style 属性を使用して「text-align:center;」スタイルを追加し、テキストが水平方向に中央揃えになるように設定します。2. style 属性を使用して「vertical-align」を追加します。 :middle;display:table -cell;" スタイル設定は垂直方向の中央に配置されます。

このチュートリアルの動作環境: Windows 7 システム、CSS3&HTML5 バージョン、Dell G3 コンピューター。

方法 1: style 属性を使用して「text-align:center;」を追加します。 style

HTML スタイル属性は要素のインライン スタイルを指定します

css text-align 属性は、center 値を使用してテキストを中央揃えに設定することにより、要素内のテキストの水平方向の配置を指定します。

例:

<p style="height: 100px; border: 1px solid red;text-align: center;">文本文字--水平居中</p>

レンダリング:

##方法 2: style 属性を使用して、「vertical-align」を追加します。 :middle;display:table-cell;" style

vertical-align:middle display:table-cell は、単一行のテキストと複数行のテキストの両方を中央揃えにできます。ただし、table-cell はインライン型であるため、元のブロックレベルの要素が div ごとに同じ行に移動されます。行を 2 つの行に分割する必要がある場合は、位置を制御するために外側に追加のコンテナーを追加する必要があります。

例:

<div style="width: 300px;height: 300px;border: 1px solid red;vertical-align:middle;display:table-cell;">
文本文字--垂直居中
</div>

レンダリング:

(学習ビデオ共有:

css ビデオ チュートリアル)

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