सीएसएस को एचटीएमएल, बॉडी और सार्वभौमिक चयनकर्ता * में लागू करने में क्या अंतर है?

Question

एक ही HTML दस्तावेज़ पर लागू होने पर ये तीन नियम अलग-अलग कैसे होते हैं?

html { 
    color: black; 
    background-color: white; 
} 

body { 
    color: black; 
    background-color: white; 
} 

* { 
    color: black; 
    background-color: white; 
} 

Answer 1

1. html { 
       color: black; 
       background-color: white; 
   } 
   

   यह नियम html तत्व पर लागू होता है रंग। html तत्व के सभी वंशज color (लेकिन background-color नहीं), body सहित हैं। body तत्व में कोई डिफ़ॉल्ट पृष्ठभूमि रंग नहीं है, जिसका अर्थ यह पारदर्शी है, इसलिए html की पृष्ठभूमि तब तक दिखाई देगी जब तक आप body के लिए पृष्ठभूमि सेट नहीं करते।

   हालांकि html की पृष्ठभूमि पूरे व्यूपोर्ट पर चित्रित की गई है, html तत्व स्वयं व्यूपोर्ट की पूरी ऊंचाई को स्वचालित रूप से नहीं फैलाता है; पृष्ठभूमि बस व्यूपोर्ट के लिए प्रचारित है। विवरण के लिए this answer देखें।

2. body { 
       color: black; 
       background-color: white; 
   } 
   

   यह नियम body तत्व पर लागू होता है रंग। body तत्व के सभी वंशज अपने color का उत्तराधिकारी हैं।

   कैसे html की पृष्ठभूमि स्वचालित रूप से व्यूपोर्ट में प्रचारित किया जाता है करने के लिए

   इसी तरह, body की पृष्ठभूमि html लिए स्वचालित रूप से प्रचारित किया जाएगा, जब तक और जब तक आप के रूप में अच्छी html के लिए एक पृष्ठभूमि निर्धारित किया है। स्पष्टीकरण के लिए this answer देखें। इस वजह से, यदि आपको केवल एक पृष्ठभूमि (सामान्य परिस्थितियों में) की आवश्यकता है, चाहे आप पहले नियम का उपयोग करें या दूसरा नियम कोई वास्तविक अंतर नहीं करेगा।

   हालांकि, जैसे कुछ निफ्टी पृष्ठभूमि प्रभाव प्राप्त करने के लिए आप html और body के लिए पृष्ठभूमि शैलियों को जोड़ सकते हैं। कैसे उपरोक्त लिंक उत्तर के लिए देखें।

3. * { 
       color: black; 
       background-color: white; 
   } 
   

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

   क्योंकि यह किसी भी संपत्ति है कि सामान्य रूप color के रूप में ऐसी विरासत में मिलती है के लिए पूरी तरह से विरासत श्रृंखला टूट जाता है, एक * नियम में उन गुणों की स्थापना बुरा व्यवहार माना जाता है जब तक आप भाग इस तरह से तोड़ने के लिए एक बहुत अच्छे कारण के (सबसे उपयोग किया है जिन मामलों में ब्रेकिंग विरासत शामिल है, उन्हें केवल एक तत्व के लिए ऐसा करने की आवश्यकता है, उन सभी उनमें से)।