CSSテキストを垂直方向に中央揃えするにはどうすればよいですか? CSS テキストの水平方向の中央揃えを実現する 4 つの方法

現在、CSS スタイルを使用して水平方向に中央揃えにする方法はたくさんありますが、CSS 水平方向の中央揃え方法を選択する方法がわからない人も多くいます。以下に、弊社の PHP 中国語 Web サイトで CSS テキストを水平方向に中央揃えにする方法と、その方法をまとめています。垂直に？ CSS テキストの水平方向の中央揃えを実現する 4 つの方法。

現在、CSS を使用してテキストを水平方向および垂直方向に中央揃えにするのは簡単ではありません。ブラウザでは利用できない CSS メソッドを使用している初心者もいます。この影響は、互換性の問題または一部の非主流ブラウザが原因である可能性があります。 [推奨読書: CSS を使用して DIV の水平方向の中央揃え表示を実現する ]

1. 絶対配置とマージンを組み合わせて使用​​します: auto

margin: auto プロパティでは、margin の後に、上、下、左、右の 4 つのプロパティがあります。margin を auto に設定している限り、最初に水平方向に中央揃えにすることができます。

2. 絶対配置を使用し、transform 属性を使用して次のことを実現します。

transform のデフォルト値は none です。その結果、変換が行われ、継承される値は次のとおりです。いいえ、変換を使用する唯一の利点は、要素のサイズを知る必要がないことです。変換のオフセットのパーセンテージは要素のサイズに比例します。

3. を中心に絶対配置で div を使用し、div の上部を 50% に設定し、margin-top を負の値 px に設定します。ネストされたタグを設定することはすべてのブラウザに適していますが、最初に中央に配置するサイズを知る必要があります。

4.padding 属性は要素の中央揃えを実現できます。

padding 属性は実際には内側の境界線の距離を設定し、要素の幅を設定します。上下左右のマージン この方法はより実用的です。単純に、均等なマージンを設定する限り、要素の垂直方向のセンタリングが行われます。

上記は、CSS テキストの垂直方向の中央揃えを実現する方法についてです。 CSS テキストの水平方向の中央揃えを実現する 4 つの方法の完全な紹介 CSS チュートリアル について詳しく知りたい場合は、php 中国語 Web サイトに注目してください。

以上がCSSテキストを垂直方向に中央揃えするにはどうすればよいですか? CSS テキストの水平方向の中央揃えを実現する 4 つの方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。