फ़ॉन्ट आकार को ठीक से कैसे परिभाषित किया जाए

Aug 16 2020

मैं एक spanतत्व को बिल्कुल परिभाषित ऊंचाई (इस उदाहरण में 23px) के साथ प्राप्त करने का प्रयास करता हूं । हालाँकि, ब्राउज़र तत्व में कुछ पिक्सेल जोड़ता है।

कोई paddingऔर नहीं है margin, यह वास्तविक पाठ है जो बड़ा है। मैं पाठ ऊंचाई (और इसके साथ spanऊँचाई भी ) कैसे प्राप्त करूँ 23px?

आवश्यकताएँ:

  • कोई परीक्षण और त्रुटि (या अन्य विधि) यह काम करने के लिए 23px के पास कुछ मनमानी संख्या का पता लगाने के लिए।
  • पूरे पाठ को स्पैन की सीमा के भीतर रहने की आवश्यकता है (पाठ के अंदर की परवाह किए बिना)।
  • पाठ को लपेटता है, तो विधि को सहजता से काम करना चाहिए। (यानी तत्व का आकार दो लाइनों के साथ 46px, तीन लाइनों के साथ 69px आदि होगा)

span {
  font-size: 23px;
  line-height: 23px;
  border: red dashed 1px;
}
<span>This element is ...x28 (...x30 with border), but should be ...x23 (...x25 with border).</span>

जवाब

1 BodoThiesen Sep 11 2020 at 18:27

एक टिप्पणी में अलोहसी द्वारा दिया गया उत्तर:

आप अभी ऐसा नहीं कर सकते। आपको 23px और एसेंट और डीसेंट फ़ॉन्ट मैट्रिक्स के आधार पर गणना करने की आवश्यकता होगी। लेकिन वर्तमान में, सीएसएस उस गणना के लिए फ़ॉन्ट मैट्रिक्स को उजागर नहीं करता है। मेरा मानना ​​है कि फ़ॉन्ट मेट्रिक्स को उजागर करने की योजना है, हालांकि मुझे यकीन नहीं है कि वे क्या रूप लेंगे। कोई भी ब्राउज़र वैसे भी इसका समर्थन नहीं करता है।