Sen burayı gördün, başkası da görecek. Teklifini gönder, sitenin kahramanı ol.

Sponsor'un katkılarıyla...

CSS visibility Özelliği

CSS visibility Özelliği

CSS visibility özelliği; bir ögenin -belgenin görünümüne etki etmeden (yani öge için gereken boşluğu bırakarak)- gösterilip gösterilmeyeceğini belirler. Bu özellik aynı zamanda table etiketinde satırları ve sütunları gizleyebilir.

/ 19.05.1919?

visibility Özelliği Temel Özellikler

CSS Yazımı :
visibility: collapse | hidden | visible;
Örnek :
visibility: hidden; | visibility: visible;
Öntanımlı Değer :
visible
Uygulanabilen Etiketler :
Tüm ögeler.
Kalıtsallık :
Var
Tarayıcı Desteği :
Tüm Tarayıcılar
Animasyon :
Destekleniyor animation Özelliği

Animasyon için gerekli olan kutuplar arası geçiş efektinin uygulanabilmesi için kutupların arasında geçiş gerçekleştirilebilmeli. Bu özellik ögeyi ya gösterir ya da gizler. Kutuplar arasında gerçekleştirilebilecek adım olmadığından ötürü geçiş efekti (transition) destekli animasyon, adım adım değil bir anda gerçekleşir.

Javascript :
öge.style.visibility = "hidden";
Sürüm :
CSS2 (düz. 1) / CSS Transitions / CSS Basic Box Model / CSS Flexible Box Layout Module
Açıklama :
visibility özelliği içeriğin mi gösterileceğini yoksa içerik yerine boşluk mu kullanılacağını ayarlar.

visibility Özelliği Kullanımı

Sponsor'un katkılarıyla...

Markanız için 300X300 alan.

Reklamı kapat görseli

CSS visibility özelliği; bir ögenin -belgenin görünümüne etki etmeden (yani öge için gereken boşluğu bırakarak)- gösterilip gösterilmeyeceğini belirler. Bu özellik aynı zamanda table etiketinde satırları ve sütunları gizleyebilir.

visibility özelliği ögeyi etiketi görünmez yapar. Etiket görünmez olsa da sayfada yer kaplamaya devam eder.

Görünmeyen etiketlerin sayfada yer kaplamaması için display: none; kullanılmalı. Daha fazlası için display özelliğine bakın.

visibility Özelliği Tarayıcı Desteği

MasaüstüTaşınabilir
Tarayıcı →Özellik ↓
Temel Destek 1 4 1 1 4 [1] [2]
collapse Var [5] Var [6] Var [7] [8] 62 [3] [4] Var
Tarayıcı →Özellik ↓
Temel Destek 4 6 1 1 Var
collapse Var [5] Var [6] Var [7] [8] Yok Var

[1] visibility: initial; İnternet Explorer tarafından desteklenmiyor.

[2] İnternet Explorer 7'ye kadar gizli ögelerin alt kuşağı (çocukları, torunları v.b.) öge görünür yapıldıktan sonra da görünmez kalmaya deveam ediyorlar.

[3] Chrome visibility: collapse; uygulandığında boşluk bırakmadan hidden gibi davranıyor.

[4] Chrome collapse değerini yalnızca <tr> etiketinde, <thead> etiketinde, <tbody> etiketinde, ve <tfoot> etiketinde destekliyor ama <col> etiketinde ve <colgroup> etiketinde desteklemiyor.

[5] Firefox <col> etiketinde ve <colgroup> etiketinde border-collapse: collapse; ise çerçeveleri gizlemiyor.

[6] Tablo ögelerine uygulanan visibility: collapse; Opera'da çalışır ancak komşusu görünür bir <tbody> etiketi olan <tfoot> etiketini gizlemez.

[3] Safari visibility: collapse; uygulandığında boşluk bırakmadan hidden gibi davranıyor.

[4] Safari collapse değerini yalnızca <tr> etiketinde, <thead> etiketinde, <tbody> etiketinde, ve <tfoot> etiketinde destekliyor ama <col> etiketinde ve <colgroup> etiketinde desteklemiyor.

Kaynak: Mozilla Geliştirici Ağı - MDN 10 Yaşında - CC-BY-SA 2.5

visibility Özelliğinin Alabileceği Değerler

collapse
Dizelgelerde kullanılır. Dizelge içeriği görünmez olur. Ancak dizelge hala başka içerik için aynı "biçim"'le kullanılabilir.
Diğer etiketlerde kullanılırsa hidden olarak yorumlanır.
hidden
Öge görünmez ancak sayfada yer kaplamaya devam eder.
visible
Öge görünür. Öntanımlı değer.

visibility Özelliği ile İlişkili Özellikler

display Özelliği
Ögeyi oluşturan kutunun nasıl davranması gerektiğinin belirler.
opacity Özelliği
Ögenin saydamlık seviyesini ayarlar.
Reklamı kapat görseli

Görüş Bildirin?

Toplam Oy Sayısı : Şimdilik hiç oy verilmemiş.

Ortalama Oy Değeri : Verilen oyun geçerli olması için yapılan yorumun onaylanması gerekiyor.

Görüşler yükleniyor . . .

Yorum Ekle?

1000
CSS visibility Özelliği