विशिष्टता के नियमों का लाभ उठाने के दौरान सीएसएस एम इकाइयों से सावधान रहें?

Question

मुझे पीएक्स इकाइयों के विपरीत ईएम इकाइयों के साथ फ़ॉन्ट आकार निर्दिष्ट होने पर रखरखाव योग्य सीएसएस कोड लिखने में परेशानी हो रही है। मैं इस तरह सीएसएस कोड लिखने के आदी किया गया है:

body {font-size: 12px;} 
body .sidebar {font-size:11px;} 
body .sidebar .loadmore {font-size:10px;} 
body .sidebar .warning {font-size:13px;} 

विचार साइट बाहर के माध्यम से कई पन्नों पर, वहाँ है कि 12 पिक्सेल font-size होना चाहिए पाठ का एक बहुत है कि है। मैं साइट के विशेष क्षेत्रों में 12px फ़ॉन्ट आकार को ओवरराइड करने के लिए विशिष्टता के नियमों का लाभ उठाता हूं।

चलो कहते हैं कि मैं के रूप में ऊपर कोड दुबारा लिखा है:

body {font-size: 12em;} 
body .sidebar {font-size:11em;} 
body .sidebar .loadmore {font-size:10em;} 
body .sidebar .warning {font-size:13em;} 

अगर मैं उपरोक्त कोड में उन्हें साथ पिक्सल की जगह, मेरी समझ मैं विशिष्टता के नियमों का लाभ खोना है। कोड के लाइन 3 को "एमएम के 11 एम के 10 एम" के रूप में व्याख्या किया जाएगा, जो कि सभी पिछले नियमों को ओवरराइड नहीं करता है और 10 एम (डिफ़ॉल्ट क्या है?) का उपयोग करें। क्या मैंने सही कहा है?

संपादित करें यदि मैंने जो कहा है वह सही है, तो एक फ़ॉन्ट आकार नियम कैसे लिखता है जैसे "सभी तत्वों के लिए फ़ॉन्ट आकार एक्स का उपयोग करें, लेकिन साइड बार पर फ़ॉन्ट आकार वाई का उपयोग करें"?

Answer 1

जॉन जिस विशिष्टता के बारे में आप बात कर रहे हैं वह उस तरीके से होगा जैसा आपने कहा है। एक संदर्भ क्यों देखा जा सकता है: http://kyleschaeffer.com/best-practices/css-font-size-em-vs-px-vs-pt-vs/।

संपादित करें अपने संपादन के जवाब के रूप में कृपया देखें कि आपकी मूल पोस्ट की टिप्पणियों में जेनीलेन ने क्या पोस्ट किया है।

जैसा कि आपने शरीर के लिए सूचीबद्ध किया है 12 एम का फ़ॉन्ट आकार {font-size: 12em;} डिफ़ॉल्ट फ़ॉन्ट आकार को वर्तमान आकार के 12x तक स्केल करने जा रहा है। यदि आप एम का उपयोग करना चाहते हैं तो आपको इस बात पर विचार करने की आवश्यकता है कि आप किस पैमाने की दर का उपयोग करना चाहते हैं और गणित करना चाहते हैं। यदि आप नेस्टेड कथन के साथ निश्चित आकार निर्धारित करना चाहते हैं तो आपको निश्चित विशेषताओं (पिक्सेल) पर चिपकने की आवश्यकता है। मेरे द्वारा लिंक किए गए आलेख में बताए गए एमएम का लाभ यह है कि आप एक डिफ़ॉल्ट आकार निर्धारित कर सकते हैं, 12 पीएक्स कहें और फिर उन्हें स्केल करने के लिए एम का उपयोग करें। उदाहरण के लिए मोबाइल आधारित वेबसाइटों में।

Answer 2

हां, em मूल्य "गुणा" करते हैं जब वे लागू तत्वों को घोंसला देते हैं। यह एक विशिष्टता मुद्दा नहीं है - यदि आपने .loadmore और .sidebar के लिए व्यक्तिगत रूप से नियम निर्दिष्ट किए हैं तो आपको एक ही समस्या दिखाई देगी, क्योंकि .sidebar में .loadmore शामिल हैं।

यहाँ एक तरीका का एक उदाहरण इस के साथ काम करने के लिए है: http://jsfiddle.net/PJWrW/

मैं आमतौर पर, फ़ॉन्ट आकार के लिए या तो px या प्रतिशत इकाइयों का उपयोग यह स्पष्ट है कि मैं एक निरपेक्ष फ़ॉन्ट आकार सेट कर रहा हूं या माता-पिता फ़ॉन्ट को संशोधित करने के लिए आकार।

मैं कभी-कभी em इकाइयों का उपयोग पैडिंग और चौड़ाई जैसे आयामों को परिभाषित करने के लिए करता हूं, क्योंकि em यूनिट मूल रूप से वर्तमान फ़ॉन्ट आकार पर एक अक्षर की चौड़ाई है।

Answer 3

जहां तक ​​मुझे पता है, यदि आप फ़ॉन्ट आकार के लिए एम का उपयोग कर रहे हैं, तो बाएं हाथ की ओर बार (या उस मामले के लिए कहीं और) में तत्वों के लिए मानक फ़ॉन्ट आकार सेट करने का कोई भी तरीका नहीं है उस साइड बार में कुछ तत्वों का आकार। यदि आप एम का उपयोग करते हैं तो आपको उस साइड बार में सभी तत्वों के आकार निर्दिष्ट करना होगा।

व्यक्तिगत रूप से मैं आमतौर पर फ़ॉन्ट आकार के लिए पीएक्स का उपयोग करता हूं, क्योंकि आप अपने पोस्ट में कुछ तत्वों के लिए मानक फ़ॉन्ट आकार सेट कर सकते हैं।

एकमात्र विश्वसनीय तर्क मैंने पीएक्स पर एमएम का उपयोग करने के लिए सुना है जो अब वास्तव में एक समस्या नहीं है (आईई 6 आपको पीएक्स का उपयोग करने पर मैन्युअल रूप से फ़ॉन्ट आकार बदलने की अनुमति नहीं देता है लेकिन अधिकांश लोगों ने आईई 6 के लिए हैकिंग बंद कर दी है पीछे की ओर) एकमात्र असली स्थिति जिसे मैं लाभ के रूप में उपयोग कर देख सकता हूं वह यह है कि यदि आप कार्यक्षमता को कार्यान्वित करना चाहते हैं, जिससे उपयोगकर्ता here