CSS मध्ये "प्रदर्शन: काहीही नाही" आणि "दृश्यमानता: लपलेले" यातील फरक

काहीवेळा असू शकेल, जसे की आपण वेब पृष्ठांच्या विकासावर काम करता, तेव्हा आपल्याला एका विशिष्ट कारणास्तव किंवा विशिष्ट आयटमच्या "लपविण्यासाठी" विशिष्ट भागांची आवश्यकता आहे. आपण नक्कीच HTML मार्कअपच्या प्रश्नांत आयटम (म्स) काढू शकता , परंतु आपण त्यांना कोडमध्ये राहू इच्छित असल्यास परंतु कोणत्याही कारणास्तव ब्राउझर स्क्रीनवर प्रदर्शित न केल्यास (आणि आम्ही त्या कारणांचे पुनरावलोकन करु. हे लवकरच करा) आपल्या HTML मध्ये एक घटक ठेवण्यासाठी, परंतु प्रदर्शनासाठी ती लपवा, आपण सीएसएस चालू कराल.

एचटीएमएलमधील घटक लपविण्यासाठी दोन सर्वात सामान्य मार्ग "डिस्प्ले" किंवा "व्हिज्युबिलिटी" साठी सीएसएस गुणधर्म वापरत आहेत. पहिल्या दृष्टीक्षेपात, या दोन गुणधर्मांना मुख्यत्वे समान गोष्टी करणे दिसत आहे, परंतु त्यांच्या प्रत्येक वेगळ्या फरक आहेत ज्यात आपल्याला याची जाणीव असावी. चला प्रदर्शन: काहीही नाही आणि दृश्यमानता: लपविलेले यांच्यातील फरकाकडे पहा.

दृश्यमानता

सीएसएस प्रॉपर्टी / व्हॅल्यू जोडी व्हिज्युबिलिटी वापरणे: ब्राऊझरमधील लपलेले लपवलेली एक घटक. तथापि, लपविलेले घटक अजूनही लेआउटमध्ये जागा घेतात. आपण मूलतः अदृश्य घटक बनवल्यासारखे असेच आहे, परंतु हे अद्याप अस्तित्वात राहते आणि फक्त त्या जागेवरच ठेवलेले स्थान घेते जेणेकरून ते एकटे सोडले असेल.

जर आपण आपल्या पृष्ठावर एक डीआयव्ही ठेवा आणि 100x100 पिक्सेल घेण्यास परिमाणे देण्यासाठी सीएसएस वापरत असाल, तर दृश्यमानता: लपविलेले गुणधर्म डीव्हीडी स्क्रीनवर दर्शविणार नाहीत, परंतु खालील मजकूर ते येथे अजूनही आहे तेथेच असे कार्य करतील 100x100 अंतर

प्रामाणिकपणे, दृश्यमानता गुणधर्म म्हणजे आपण वारंवार वापरलेली काहीच नाही आणि निश्चितपणे आपल्या स्वत: च्यावर नाही. जर आपण इतर सीएसएस गुणधर्मांचा वापर करीत असाल तर काही लेआउट मिळविण्याची पोजीशनिंग आम्ही एका विशिष्ट घटकासाठी केली होती, तर आम्ही त्या वस्तूला सुरुवातीला लपविण्यासाठी दृश्यमानता वापरु शकू, फक्त होव्हरवर परत "चालू" करण्यासाठी. या मालमत्तेचा तो एक संभाव्य उपयोग आहे, पण पुन्हा, आम्ही कोणत्याही वारंवारता सह चालू काहीतरी नाही

प्रदर्शन

दृश्यमानता प्रॉपर्टीच्या विपरीत, जे सामान्य दस्तऐवजाच्या प्रवाहामध्ये घटक सोडते, प्रदर्शित करतेः कोणीही दस्तऐवजातून घटक पूर्णपणे काढून टाकत नाही. तो कोणत्याही जागा घेऊ शकत नाही, जरी तो मूळ कोडमध्ये असलेला HTML असला तरीही. कारण कागदपत्रांच्या प्रवाहामधून ती काढली जाते. सर्व हेतू आणि उद्देशांसाठी, आयटम निघून गेला आहे. आपल्या हेतू काय आहेत त्यावर अवलंबून ही चांगली गोष्ट किंवा वाईट गोष्ट असू शकते. आपण या मालमत्तेचा गैरवापर केल्यास हे आपल्या पृष्ठावर देखील हानिकारक ठरू शकते!

पृष्ठाची चाचणी करताना आम्ही वारंवार "प्रदर्शन: काहीच नाही" वापरतो. थोड्या थोड्या वेळासाठी आपल्याला "दूर" जाण्यासाठी क्षेत्राची आवश्यकता असल्यास आम्ही पृष्ठाच्या इतर भागाचे परीक्षण करू शकू, आम्ही डिस्प्ले वापरू शकतो: त्यापैकी काही नाही लक्षात ठेवण्यासारखी गोष्ट म्हणजे, त्या साइटच्या वास्तविक लाँचपूर्वी पृष्ठावर परत घटक परत करणे आवश्यक आहे. याचे कारण असे की या पद्धतीमधील कागदपत्र प्रवाहामधून काढले गेलेले घटक शोध इंजिन्स किंवा स्क्रीन वाचकांद्वारे पाहिले जात नाहीत, तरीही ते HTML मार्कअपमध्ये राहू शकतात. पूर्वी, या पद्धतीचा वापर शोध इंजिन रॅंकिंगला प्रभावित करण्याच्या प्रयत्नाचा एक कृष्ण-हॅट पद्धती म्हणून केला गेला, म्हणून Google ने दर्शवण्याचा प्रयत्न केला की हा मार्ग वापरण्यात येत आहे

आपण ज्या पद्धतीने एक डिस्प्ले आकारासाठी उपलब्ध असणारे घटक असू शकतात परंतु इतरांसाठी नाही अशा प्रतिसाद साइट तयार करत असताना, काही उपयोगी नाही, आणि आम्ही ते थेट, उत्पादन वेबसाईटवर वापरतो तेव्हा आहे. आपण त्या घटक लपवण्यासाठी डिस्प्ले: none वापरू शकता आणि नंतर नंतर मीडिया क्वेरी परत चालू करु शकता. हा डिस्प्लेचा एक स्वीकार्य वापर आहे: काहीच नाही, कारण आपण काही कारणास्तव लपवून ठेवण्याचा प्रयत्न करीत नाही परंतु तसे करणे आवश्यक आहे.

जेनिफर क्रिनिन द्वारे मूळ लेख. 3/3/17 रोजी जेरेमी गिरर्ड द्वारा संपादित