ホームページ > ウェブフロントエンド > CSSチュートリアル > 水平方向の「要素」のテキストを垂直方向に中央揃えにする方法

水平方向の「要素」のテキストを垂直方向に中央揃えにする方法

DDD
リリース: 2024-10-27 05:56:29
オリジナル
798 人が閲覧しました

How to Vertically Center Text in Horizontal `` Elements?

  • の垂直方向の配置

      の要素を縦方向に揃えるには

    • <br>li {</p>
      <div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false">line-height: *height-of-li*;
      ログイン後にコピー
  • }

  • の高さを割り当てるだけです。 line-height プロパティの値として。これにより、
  • のテキスト コンテンツが確実に表示されます。指定された高さ内で垂直方向の中央に配置されます。

    例:

    <br>li {</p>
    <div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false">height: 50px;
    line-height: 50px;
    ログイン後にコピー
  • }

    このコードは、各

  • の内容を揃えます。高さ 50 ピクセル以内で垂直方向に配置することで、一貫性のある視覚的に魅力的な表示を保証します。

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

    ソース:php.cn
    前の記事:`:last-of-type` が特定のクラスの最後の要素を選択できないのはなぜですか? 次の記事:Mobile Safari で仮想キーボードがアクティブになると固定ナビゲーションがジャンプするのはなぜですか?
    このウェブサイトの声明
    この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
    著者別の最新記事
    最新の問題
    関連トピック
    詳細>
    人気のおすすめ
    人気のチュートリアル
    詳細>
    最新のダウンロード
    詳細>
    ウェブエフェクト
    公式サイト
    サイト素材
    フロントエンドテンプレート