CSS में लाइन हाइट

आइए अब टेक्स्ट की लाइन हाइट सेट करना सीखें। लाइन हाइट से तात्पर्य टेक्स्ट की पंक्तियों के बीच की दूरी से है, यानी उनके बीच का सफेद अंतर। इसके लिए line-height प्रॉपर्टी है, जो टेक्स्ट लाइन की ऊंचाई निर्धारित करती है।

line-height प्रॉपर्टी का उपयोग करते समय आपको एक हैरानी हो सकती है: यह प्रॉपर्टी टेक्स्ट की पंक्तियों के बीच का अंतराल नहीं देती, जैसा कि लग सकता है, बल्कि यह टेक्स्ट लाइन की ऊंचाई निर्धारित करती है।

इसका मतलब है कि पंक्तियों के बीच दिखने वाला वास्तविक अंतर इस तरह गणना की जाएगी: line-height - font-size = टेक्स्ट की पंक्तियों के बीच दिखने वाली दूरी।

निम्नलिखित उदाहरण में टेक्स्ट की पंक्तियों के बीच की दूरी 50px - 20px = 30px होगी:

html<p>
  some long text
</p>

cssp {
  font-size: 20px;
  line-height: 50px;
  text-align: justify;
  width: 400px;
}

Результат: