नियंत्रण की शैली display: none
और display: block
सेट करने के बीच क्या अंतर है?प्रदर्शन के बीच कोई अंतर और प्रदर्शन ब्लॉक
उत्तर
प्रदर्शन संपत्ति परिभाषित करती है कि एक निश्चित HTML तत्व को कैसे प्रदर्शित किया जाना चाहिए। प्रदर्शन block
और none
HTML तत्वों को दिखाने या छिपाने के लिए उपयोग किया जाता है। आप प्रदर्शन संपत्ति और उपलब्ध विकल्पों के बारे में अधिक पढ़ सकते हैं here।
कोई नहीं: तत्व बिल्कुल प्रदर्शित नहीं किया जाएगा।
ब्लॉक: तत्व (पैराग्राफ और हेडर की तरह) एक ब्लॉक स्तर तत्व के रूप में प्रदर्शित
आप एक सीएसएस संपत्ति मुझे लगता है कि के बारे में पूछ रहे हैं। यह/छिपाने डोम तत्वों को दिखाने के लिए प्रयोग किया जाता है
सीएसएस संपत्ति प्रदर्शन और मूल्य 'कोई नहीं', 'ब्लॉक', आदि
से बात कर रहा है: CSS Display रूप से http://w3fools.com/
ब्लॉक सुझाव
ऑब्जेक्ट को ब्लॉक तत्व के रूप में प्रस्तुत किया जाता है।
कोई भी
तत्व प्रदान की नहीं है। तत्व (इसका लेआउट पर कोई प्रभाव नहीं पड़ता है); सभी बाल तत्वों का भी अपना प्रदर्शन बंद हो जाता है। दस्तावेज प्रस्तुत किया गया है जैसे कि तत्व मौजूद नहीं था।
इनलाइन
डिफ़ॉल्ट। ऑब्जेक्ट को सामग्री के आयामों द्वारा आकार में एक इनलाइन तत्व के रूप में प्रस्तुत किया जाता है।
सूची आइटम
इंटरनेट एक्सप्लोरर 6 और बाद में। ऑब्जेक्ट को ब्लॉक तत्व के रूप में प्रस्तुत किया जाता है, और एक सूची-आइटम मार्कर जोड़ा जाता है।
टेबल हैडर-समूह
वस्तु ठेड के रूप में प्रदान की गई है। तालिका शीर्षलेख हमेशा अन्य सभी पंक्तियों और पंक्ति समूहों, और किसी भी शीर्ष कैप्शन के बाद प्रदर्शित होता है। शीर्षलेख तालिका द्वारा फैले प्रत्येक दस्तावेज़ पर प्रदर्शित होता है।
टेबल पाद-समूह
वस्तु tfoot के रूप में प्रदान की गई है। टेबल फूटर हमेशा अन्य सभी पंक्तियों और पंक्ति समूहों के बाद प्रदर्शित होता है, और किसी भी नीचे के कैप्शन से पहले। एक तालिका द्वारा फैले प्रत्येक दस्तावेज़ पर पाद लेख प्रदर्शित होता है।
इनलाइन-ब्लॉक
वस्तु इनलाइन प्रदान की गई है, लेकिन ऑब्जेक्ट की सामग्री एक ब्लॉक तत्व के रूप में बनाए जाते हैं। निकट इनलाइन तत्व एक ही पंक्ति, अंतरिक्ष अनुमति पर प्रदान किए जाते हैं।
प्रदर्शन: कोई नहीं; - तत्व DOM
में है लेकिन यह दिखाई नहीं दे रहा है और visibility:hidden
के विपरीत कोई भी space
नहीं लेता है।
प्रदर्शन: ब्लॉक; - एक ब्लॉक तत्व full width
उपलब्ध कराता है और अन्य तत्वों को उनके बगल में रखने की अनुमति नहीं देता है। उदाहरण: div
कोई प्रदर्शन नहीं: यह नियंत्रण छुपाता है। तत्व शैली की संपत्ति की स्थापना द्वारा =: तत्व "प्रदर्शन कोई नहीं" वेबपेज में गाया नहीं है और नहीं हो
प्रदर्शन ब्लॉक: ब्लॉक स्तर में वेब पेज पर तत्व दिखाएँ
प्रदर्शन से कोई भी शामिल छुपा देगा, यहां यदि आप इसे div पर लागू करते हैं तो div की चौड़ाई और ऊंचाई भी छिप जाएगी। प्रदर्शन ब्लॉक शामिल दिखाएगा।
Display:none;
का अर्थ है कि तत्व प्रदर्शित नहीं किया जाएगा, और Display:block;
का अर्थ है कि तत्व ब्लॉक-स्तर तत्व (जैसे अनुच्छेद और शीर्षलेख) के रूप में प्रदर्शित होता है।
ये दो शैली गुण दो अलग-अलग चीजें करते हैं।
डिस्प्ले: कोई भी दस्तावेज़ से पूरी तरह से तत्व को हटा देता है। यह किसी भी स्थान पर नहीं लेता है, भले ही इसके लिए एचटीएमएल अभी भी स्रोत कोड में है। (तत्व बिल्कुल कोई बॉक्स उत्पन्न नहीं करेगा)
डिस्प्ले: ब्लॉक तत्व उस स्थान की पूरी चौड़ाई को विस्तारित करेगा। (तत्व से पहले और बाद में एक लाइन ब्रेक)
प्रदर्शित करने के लिए एक और बारीकियां है: कोई भी नहीं; यदि आप गतिशील रूप से एक बच्चे के रूप में एक div के रूप में एक div div - पर बच्चे को "दृश्यमान" में स्पष्ट रूप से सेट करते हैं, तो माता-पिता की दृश्यता गुण केवल माता-पिता को दृश्यमान/अदृश्य कर देगा; अभिभावक की दृश्यता सेटिंग के बावजूद बच्चा दिखाई देगा।
तरह के एक मामले में (जहां माता पिता/बच्चे दृश्यता अलग शैली नियमों से स्थापित कर रहे हैं) में, प्रदर्शन: माता-पिता होगा सभी बच्चों को छिपाने पर कोई भी सेटिंग - भले ही माता-पिता/बच्चों स्वतंत्र रूप से स्टाइल रहे हैं। ने टेक्स्ट
डिस्प्ले पर जोर दिया: इसका मतलब यह नहीं है कि तत्व बिल्कुल प्रदर्शित नहीं होता है (इसलिए आप इसे उदाहरण में नहीं देख पाएंगे)।
डिस्प्ले: ब्लॉक का मतलब है कि तत्व ब्लॉक के रूप में प्रदर्शित होता है, क्योंकि अनुच्छेद और शीर्षलेख हमेशा रहे हैं। एक ब्लॉक में ऊपर और नीचे कुछ सफेद जगह है और इसके बाद कोई HTML तत्व सहन नहीं करता है, अन्यथा
यह मेरी आखिरी परियोजना में हुआ था। .css का उपयोग (तब कोई प्रदर्शित नहीं)।सीएसएस (डिस्प्ले ब्लॉक) तालिका में शीर्षलेख में विलय हो गया है, फिर .css (दृश्यता छिपी हुई) का उपयोग करें .css (दृश्यता दृश्यमान) –