विज़िबिलिटी प्रॉपर्टी

visibility प्रॉपर्टी एलिमेंट को अदृश्यता प्रदान करती है। इस स्थिति में अन्य सभी एलिमेंट ऐसे व्यवहार करेंगे जैसे कि एलिमेंट कहीं गायब नहीं हुआ है।

सिंटैक्स

cssसिलेक्टर {
  visibility: visible या hidden या collapse;
}

मान	विवरण
`visible`	एलिमेंट दृश्यमान है।
`hidden`	एलिमेंट अदृश्य हो जाता है, मानो पारदर्शी हो गया हो और इस स्थिति में भी वह पेज के फॉर्मेटिंग में भाग लेता रहता है।
`collapse`	यदि टेबल की सेल्स की सामग्री के लिए `collapse` का उपयोग किया जाए, तो वे मानो गायब हो जाती हैं, और टेबल नए सिरे से पुनर्गठित हो जाती है। यदि यह मान टेबल की पंक्तियों या कॉलम पर लागू नहीं होता है, तो इसके उपयोग का परिणाम `hidden` के समान ही होगा।

डिफॉल्ट मान: visible.

आइए ऐसा करते हैं कि पहले पैराग्राफ का टेक्स्ट प्रारंभ में अदृश्य हो, लेकिन बटन पर कर्सर ले जाने पर 'Show text' हम उसे पढ़ सकें:

html<button>Show text</button>
<div class="text">text1</div>
<div>text2</div>

cssdiv{
  border: 1px solid black;
  width: 100px;
}
.text {
  visibility: hidden;
}
button:hover + .text {
  visibility: visible;
}

Результат: