visibility Özelliği
visibility özelliği, bir elemente görünmezlik
atar. Bununla birlikte, diğer tüm elementler
element hiçbir yere kaybolmamış gibi davranmaya
devam eder.
Sözdizimi
seçici {
visibility: visible veya hidden veya collapse;
}
Değerler
| Değer | Açıklama |
|---|---|
visible |
Element görünür. |
hidden |
Element, şeffafmış gibi görünmez olur ve aynı zamanda sayfa biçimlendirmesinde yer almaya devam eder. |
collapse |
collapse değeri tablo hücrelerinin içeriği için kullanılırsa,
sanki yok olurlar ve tablo
yeniden yapılandırılır.
Bu değer tablo satırları veya sütunları için uygulanmazsa, kullanım sonucu hidden ile aynı olacaktır.
|
Varsayılan değer: visible.
Örnek
İlk paragraftaki metnin başlangıçta görünmez olmasını
sağlayalım, ancak imleç 'Show text'
düğmesinin üzerine getirildiğinde onu okuyabilelim:
<button>Show text</button>
<div class="text">text1</div>
<div>text2</div>
div{
border: 1px solid black;
width: 100px;
}
.text {
visibility: hidden;
}
button:hover + .text {
visibility: visible;
}
:
