सीएसएस 'पूर्व' इकाई का मूल्य क्या है?

Question

बोरियत से एक फिट मैं Gmails डोम का निरीक्षण शुरू कर दिया में

आज (Xunit, एक लोकप्रिय नेट इकाई परीक्षण पुस्तकालय। साथ भ्रमित होने की नहीं) (हाँ, मैं बहुत ऊब गया था)।

सब कुछ बहुत सरल दिखता है जब तक कि मैंने कुछ तत्वों की चौड़ाई पर एक दिलचस्प विनिर्देश नहीं देखा। शानदार गूगलाइट्स ने दुर्लभ 'पूर्व' इकाई का उपयोग करके कई टेबल कोल्स निर्दिष्ट किए थे।

width: 22ex; 

पहले तो मुझे स्टम्प्ड गया था ("? क्या एक 'पूर्व' है"), फिर इसे वापस मेरे पास आया: मैं साल पहले से कुछ याद करने लगते हैं जब पहली मैं सीएसएस के बारे में सीखने गया था। From the CSS3 spec:

[पूर्व इकाई है] first available font का इस्तेमाल किया एक्स-ऊंचाई के बराबर। एक्स-ऊंचाई को इसलिए कहा जाता है क्योंकि यह अक्सर लोअरकेस "एक्स" की ऊंचाई के बराबर होता है। हालांकि, एक 'पूर्व' को फोंट के लिए भी परिभाषित किया गया है जिसमें "x" नहीं है।

अच्छा और अच्छा। लेकिन मैंने वास्तव में इसे पहले कभी नहीं देखा है (इसे स्वयं कम इस्तेमाल किया है)। मैं आमतौर पर ईएमएस का उपयोग करता हूं, और उनके मूल्य की सराहना करता हूं, लेकिन "पूर्व" क्यों? ऐसा लगता है कि एम की तुलना में माप बहुत कम मानक है, और बहुत कम उपयोगी है।

स्टीफन पोले के http://www.xs4all.nl/~sbpoley/webmatters/emex.html इस विषय पर चर्चा करने वाले कुछ पृष्ठों में से एक है। स्टीफन अच्छे अंक बनाता है, हालांकि, उनकी चर्चा मेरे लिए अनिश्चित लगती है।

तो मेरा प्रश्न है: 'पूर्व' इकाई वेब डिज़ाइन को किस कीमत पर उधार देती है?

(यह सवाल व्यक्तिपरक में चिह्नित किया जा सकता है, लेकिन मुझे लगता है कि निर्णय अपने आप से लेकर अधिक अनुभव SO'ers छोड़ देंगे।)

Answer 1

यह उपयोगी होता है जब आप की ऊंचाई के संबंध में आकार कुछ करना चाहते हैं अपने पाठ के लोअरकेस अक्षर। उदाहरण के लिए, तो जैसे एक डिजाइन पर काम करने की कल्पना:

डिजाइन के मुद्रण आयाम में, पत्र की ऊंचाई तत्वों के बाकी के लिए महत्वपूर्ण स्थानिक रिश्तों है। उपरोक्त स्रोत छवि में रेखाएं टेक्स्ट की एक्स-ऊंचाई को इंगित करने में मदद करने के लिए हैं, लेकिन वे यह भी दिखाते हैं कि उस पाठ के आसपास डिज़ाइन करने पर दिशानिर्देश कहाँ होंगे।

जैसा कि जोनाथन ने टिप्पणियों में बताया, पूर्व केवल एम (चौड़ाई) का ऊंचाई संस्करण है।

Answer 2

का मान सीएसएस स्पेक, में होने पर यह है कि यदि आप वास्तव में पूछ रहे हैं, तो बिल्कुल एम इकाई होने के मूल्य के समान ही है।

यह आपको संबंधित आकारों पर फ़ॉन्ट सेट करने में सक्षम बनाता है।

आप नहीं जानते कि मेरा मूल फ़ॉन्ट आकार क्या है। इसलिए वेब डिज़ाइन के लिए एक अच्छी रणनीति फ़ॉन्ट आकार सेट करना है जो पूर्ण के बजाय सापेक्ष हैं; "दस पिक्सेल" जैसे निश्चित आकार के बजाय "अपने सामान्य आकार को दोगुना" या "अपने सामान्य आकार से थोड़ा छोटा" के बराबर।

Answer 3

यहां विचार करने की एक और बात यह है कि जब कोई उपयोगकर्ता अपने फ़ॉन्ट आकार को ऊपर या नीचे करता है तो शायद आपका पृष्ठ स्केल करता है (शायद ctrl + mouse wheel (windows) का उपयोग करके)।

मैंने एम के साथ उपयोग किया है .. पैडिंग-बाएं: 2 एम; पैडिंग-दाएं: 2 एम;

और पूर्व पैडिंग-तल: 2 एक्स; पैडिंग-टॉप: 2 एक्स;

इस प्रकार एक लंबवत स्केलिंग संपत्ति के लिए माप की लंबवत इकाई और क्षैतिज स्केलिंग संपत्ति के लिए माप की एक क्षैतिज इकाई का उपयोग करना।

Answer 4

ध्यान दें कि, "सिंगल/डबल लाइन स्पेसिंग" जैसे शब्द वास्तव में em द्वारा मापा गया दो आसन्न रेखाओं के बीच ऑफ़सेट का मतलब है। तो "डबल लाइन स्पेसिंग" का अर्थ है कि प्रत्येक पंक्ति में 2 em की ऊंचाई है।

इसलिए, यदि आप "रेखाओं" के आनुपातिक एक लंबवत दूरी निर्दिष्ट करना चाहते हैं, तो एम का उपयोग करें। अगर आप लोअरकेस अक्षर की वास्तविक ऊंचाई चाहते हैं, तो केवल पूर्व का उपयोग करें, जो कि मैं कहता हूं, एक दुर्लभ उदाहरण है।

Answer 5

प्रश्न का उत्तर देने के लिए, एक उपयोग सुपरस्क्रिप्ट और सबस्क्रिप्ट के साथ है। उदाहरण:

sup { 
    font-size: 75%; 
    height: 0; 
    line-height: 0; 
    position: relative; 
    vertical-align: baseline; 
    bottom: 1ex; 
}