HTMLでテキストを中央揃えにする方法

htmlテキストを中央揃えにする方法: 1. CSS 属性値「text-align:center」をテキストが配置されているラベルに追加します; 2. CSS 属性値「text-align」をインライン ラベルに追加しますまたはインラインブロックレベルのラベル:left"。

この記事の動作環境: Windows7 システム、HTML5&&CSS3 バージョン、Dell G3 コンピューター。

2 つの状況: 1. テキスト形式が中央に配置されている; 2. テキストが配置されているラベルがウィンドウの中央に配置されている。

1. テキストが配置されているラベルに CSS 属性値「text-align:center」を追加します。例:

<p style="text-align:center">我是文本，居中显示</p>

2。多くの方法がありますが、ここでは例として 2 つの方法を紹介します:

1) (推奨) テキストはインライン タグまたはインライン ブロック レベルのタグで囲む必要があります。 、インライン タグまたはインライン ブロック レベル タグは、ブロック レベル タグでラップされます。このようにして、テキスト形式が中央に配置されます。テキスト形式を中央揃えにしない場合は、CSS 属性値「text-align:left」などをインライン ラベルまたはインライン ブロック レベル ラベルに追加できます。

<div style="text-align:center"> <!-- 块级标签 -->
    <span>我是文本所在标签1，文本居中显示<span> <!-- 行内标签 -->
    <div style="display:inline-block;">我是文本所在标签2，文本居中显示</div> <!-- 行内块级标签 -->
</div>

2) テキストはブロックレベルのタグで囲まれています。ブロックレベルのタグの幅を設定し、CSS プロパティ値「margin:0 auto」を追加します。この方法では、テキスト形式が中央に配置されません。テキスト形式を中央揃えにしたい場合は、CSS 属性値「text-align:center」をブロックレベルのタグに追加できます。

<div style="width: 100px; margin:0 auto">我是文本所在标签，文本居中显示</div>

学習ビデオ共有: css ビデオ チュートリアル

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