फ़ॉन्ट-साइज़-एडजस्ट गुण
font-size-adjust गुण
फ़ॉन्ट आकार को नियंत्रित करने की अनुमति देता है, अपरिवर्तित
font-size
(बढ़ाना या घटाना)।
अनुप्रयोग: मान लीजिए कि font-family
में अल्पविराम से दो फ़ॉन्ट निर्दिष्ट हैं, उदाहरण के लिए,
Georgia, "Times New Roman"। मान लीजिए
उपयोगकर्ता के कंप्यूटर पर Georgia फ़ॉन्ट नहीं है
- इस स्थिति में "Times New Roman" लागू हो जाएगा।
हालाँकि, हमारे सामने एक समस्या आएगी - समान
मान font-size
पर फ़ॉन्ट अलग-अलग दिखाई देंगे। नीचे दिए गए उदाहरण में
दोनों अनुच्छेदों को font-size
16px पर निर्धारित किया गया है, लेकिन अलग-अलग font-family।
देखिए, आकार कितने अलग हैं:
<p style="font-size: 16px; font-family: Georgia;">
Lorem ipsum dolor sit amet.
</p>
<p style="font-size: 16px; font-family: 'Times New Roman';">
Lorem ipsum dolor sit amet.
</p>
:
ऐसा इसलिए होता है क्योंकि प्रदर्शित
फ़ॉन्ट आकार अधिकांशतः गुण
font-size
पर निर्भर नहीं करता, जो केवल फ़ॉन्ट का सामान्य आकार निर्धारित करता है,
बल्कि गुण font-size के मानों के अनुपात
और x-height की मात्रा पर निर्भर करता है (x-height
- किसी विशिष्ट फ़ॉन्ट के लिए लोअरकेस अक्षर "x"
और अपरकेस अक्षर "X" के आकार का अंतर है)।
इस अनुपात को फ़ॉन्ट का एस्पेक्ट कहा जाता है और इसकी गणना सूत्र द्वारा की जाती है: एस्पेक्ट = font-size / x-height।
आकारों की इस समस्या का समाधान गुण font-size-adjust
(यह फ़ॉन्ट के एस्पेक्ट को बदलने की अनुमति देता है) करता है, जो
दूसरे फ़ॉन्ट को पहले फ़ॉन्ट के समान आकार का दिखने के लिए मजबूर करेगा।
आइए ऐसा करें कि Times
New Roman फ़ॉन्ट Georgia
के समान आकार का हो जाए। Georgia का एस्पेक्ट हमें ज्ञात है
- यह 0.5 है (नीचे दी गई तालिका देखें)।
Times New Roman वाले टेक्स्ट के लिए
font-size-adjust को 0.5
मान पर सेट करें और देखें कि दूसरा टेक्स्ट पहले टेक्स्ट के
समान आकार का हो गया है:
<p style="font-size: 16px; font-family: Georgia;">
Lorem ipsum dolor sit amet.
</p>
<p style="font-size: 16px; font-family: 'Times New Roman'; font-size-adjust: 0.5;">
Lorem ipsum dolor sit amet.
</p>
:
सिंटैक्स
सेलेक्टर {
font-size-adjust: संख्या | none;
}
मान
| मान | विवरण |
|---|---|
number |
संख्या फ़ॉन्ट का एस्पेक्ट निर्दिष्ट करती है। |
none |
फ़ॉन्ट आकार का कोई समायोजन नहीं। |
डिफ़ॉल्ट मान: none।
फ़ॉन्ट के लिए एस्पेक्ट मान कैसे निर्धारित करें?
W3C विशिष्टता का अंश देखें:
चयनित फ़ॉन्ट के लिए आनुपातिकता गुणांक (एस्पेक्ट)
एक ही टेक्स्ट की तुलना करके निकाला जा सकता है, लेकिन अलग-अलग
font-size-adjust मान के साथ। यदि गुण का मान
सही ढंग से चुना गया है, तो फ़ॉन्ट आकार के समान होने पर
पृष्ठ पर उपयोग किए गए सभी फ़ॉन्ट के लिए टेक्स्ट अपरिवर्तित रहेगा।
मैं कुछ फ़ॉन्ट के लिए ज्ञात एस्पेक्ट मान प्रस्तुत कर रहा हूँ:
Georgia - 0.5,
Times New Roman - 0.46, Verdana -
0.58।
उदाहरण
तुलना करें कि अलग-अलग font-size-adjust मान और समान font-size
और font-family वाला टेक्स्ट कैसा दिखता है:
<p style="font-size: 16px; font-family: 'Times New Roman'; font-size-adjust: none;">
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
</p>
<p style="font-size: 16px; font-family: 'Times New Roman'; font-size-adjust: 0.5;">
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
</p>
<p style="font-size: 16px; font-family: 'Times New Roman'; font-size-adjust: 0.6;">
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
</p>
:
उदाहरण . वास्तविक जीवन में अनुप्रयोग
नीचे दिया गया कोड ऐसा करता है कि यदि उपयोगकर्ता के कंप्यूटर
पर Georgia फ़ॉन्ट नहीं है,
तो लागू होने वाला फ़ॉन्ट Times New Roman
Georgia के समान आकार का हो जाए:
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elitorire
aenean a dapibus magna, ac interdum nisl suspendisse egetile.
</p>
p {
font-size: 16px;
font-family: Georgia, "Times New Roman";
font-size-adjust: 0.5;
}
: