CSSのline-heightを継承する方法

Line-height はどのように継承されますか?

• 30px などの特定の値を書き込むと、この値が継承されます (理解しやすくなります)。2/1.5 などの比率を書き込むと、この比率が継承されます (理解しやすくなります)。
• たとえば、body の行の高さが 2 に設定されている場合、p タグは行の高さ 2 を継承し、p タグの計算された行の高さは font-size * 2 = 32px になります。
• 200% などのパーセンテージを記述すると、計算された値が継承されます (テスト ポイント) - 現在のフォント サイズ * 200%。例では、20 * 200% = 40px;

コアコードのデモンストレーション:

初期化

<スタイル>
    体{
        フォントサイズ: 20px;
    }
    ｐ {
        背景色: #ccc;
        フォントサイズ: 16px;
    }
    </スタイル>
</head>
<本文>
    <p>これはテキストの行です</p>
</本文>

具体的な値を書き込む

  体{
        フォントサイズ: 20px;
        行の高さ: 50px;
    }
    ｐ {
        背景色: #ccc;
        フォントサイズ: 16px;
    }

書き込み比率

  体{
        フォントサイズ: 20px;
        行の高さ: 1.5;
    }
    ｐ {
        背景色: #ccc;
        フォントサイズ: 16px;
    }

最初にパーセンテージを書いてから継承してください。

体{
        フォントサイズ: 20px;
        行の高さ: 200%;
    }
    ｐ {
        背景色: #ccc;
        フォントサイズ: 16px;
    }

CSS の line-height の継承方法についてはこれで終わりです。CSS の line-height の継承についての詳細は、123WORDPRESS.COM の過去の記事を検索するか、以下の関連記事を引き続き参照してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。