क्या एक सीएसएस फ़ाइल के भीतर नियमों का क्रम महत्वपूर्ण है?

Question

क्या एक सीएसएस फ़ाइल के भीतर नियमों का क्रम एक फर्क पड़ता है?

<div id="wrapper> 
    <div id="a> 
     section a 
    </div> 
    <div id="b> 
     section b 
    </div> 
    <div id="c> 
     section c 
    </div> 
</div> 

क्या # सी के लिए div नियम # ए और # बी से नीचे होना चाहिए, या स्पष्ट होगा: दोनों काम नहीं करते?

#wrapper { 
color: #CCC; 
} 

#c { 
clear:both 
} 

#a { 
float: right; 
} 

#b { 
float: left; 
} 

Answer 1

समान तत्व पर लागू होने वाले समान विशिष्ट नियमों की स्थिति में, बाद वाला एक जीतता है।

आप शैली है, तो:

.foo { color: red; } 
.bar { color: blue; } 

और मार्कअप:

<div class="foo bar">Test</div> 

फिर div में पाठ नीले रंग की जाएगी। यदि आप नियमों का क्रम बदलते हैं, तो यह लाल हो जाएगा।

Answer 2

आदेश वास्तव में महत्वपूर्ण है।

http://msdn.microsoft.com/en-us/library/aa342531%28VS.85%29.aspx#specf

देखें भाग में बोली के लिए,:

3. चयनकर्ता की विशिष्टता द्वारा क्रमबद्ध करें: उच्च विशिष्टता ओवरराइड चयनकर्ताओं कि अधिक सामान्य होते हैं साथ चयनकर्ताओं। विशिष्टता की गणना (ए) आईडी विशेषताओं, (बी) वर्ग और छद्म-वर्ग विशेषताओं की गणना को जोड़कर की जाती है, और (सी) चयनकर्ता में नाम और छद्म-तत्व टाइप करें।

उदाहरण के लिए, निम्नलिखित में से प्रत्येक चयनकर्ता एक एलआई तत्व पर लागू हो सकता है; हालांकि, एक संघर्ष की स्थिति में उच्चतम विशिष्टता के साथ केवल घोषणाएं लागू की जाती हैं।

*    {} /* a=0 b=0 c=0 -> specificity = 0 */ 
li   {} /* a=0 b=0 c=1 -> specificity = 1 */ 
ul li   {} /* a=0 b=0 c=2 -> specificity = 2 */ 
li:first-line {} /* a=0 b=0 c=2 -> specificity = 2 */ 
ul ol+li  {} /* a=0 b=0 c=3 -> specificity = 3 */ 
li.class  {} /* a=0 b=1 c=1 -> specificity = 11 */ 
li#id   {} /* a=1 b=0 c=1 -> specificity = 101 */ 

4.Sort आदेश द्वारा निर्दिष्ट: अगर दो नियम एक ही वजन और विशिष्टता है, पिछले एक जीत पार्स। (ध्यान दें कि @import नियम के साथ निर्दिष्ट स्टाइलशीट पहले पार्स किए गए हैं।) स्टाइलशीट में बाद में दिखाई देने वाले चयनकर्ता का उपयोग तब किया जाएगा जब कोई संघर्ष हो। इस कारण से, छद्म-वर्ग चयनकर्ताओं को लिंक हमेशा निम्नलिखित क्रम में उपयोग किया जाना चाहिए।

अधिक उदाहरणों के साथ व्यापक विवरण के लिए http://www.smashingmagazine.com/2009/08/17/taming-advanced-css-selectors/ भी देखें।

ध्यान दें कि चूंकि आपके उदाहरण में कोई ओवरलैप नहीं है, इसलिए आदेश महत्वपूर्ण नहीं है। यदि, दूसरी ओर, आप विरोधाभासी शैलियों थे, तो वजन, विशिष्टता और आदेश प्रासंगिक होगा। मुझे लगता है कि प्रश्न में आपका उदाहरण अपेक्षाकृत सरल है।

Answer 3

आदेश केवल तभी महत्वपूर्ण है जब नियम एक ही तत्व के समान गुण पर लागू होते हैं। (उस स्थिति में, अंतिम नियम "जीतता है"।) आपके उदाहरण में, आदेश कोई फर्क नहीं पड़ेगा।