Opaklık: 0, görünürlük: gizli ile tam olarak aynı etkiye sahip mi

Öyleyse, visibilitymülkü fiilen kullanımdan kaldırıyor mu?

(Internet Explorer'ın henüz bu CSS2 özelliğini desteklemediğinin farkındayım.)
Düzen motorlarının karşılaştırmaları

Ayrıca bakınız: görünürlük: gizli ve görüntülü: yok arasındaki fark nedir

İşte çeşitli yanıtlardan doğrulanmış bilgilerin bir derlemesi.

Bu CSS özelliklerinin her biri benzersizdir. Görünmeyen bir öğeyi oluşturmaya ek olarak, aşağıdaki ek etkilere sahiptirler:

1. Öğenin normalde kaplayacağı alanı daraltır
2. Olaylara yanıt verir (ör. Tıklama, tuşa basma)
3. Katılır TabOrder

                     olaylar sekme sırasını daralt
opaklık: 0 Hayır Evet Evet
görünürlük: gizli Hayır Hayır Hayır
görünürlük: daralt Evet * Hayır Hayır
ekran: yok Evet Hayır Hayır

* Evet, bir tablo öğesinin içinde, aksi takdirde Hayır.

Hayır.

Opaklığa sahip öğeler, yeni yığınlama bağlamı oluşturur.

Ayrıca, CSS spesifikasyonu bunu tanımlamaz, ancak içeren öğeler opacity:0tıklanabilir ve içeren öğeler visibility:hiddendeğildir.

Hayır değil. Arada büyük bir fark var. Benzerler, çünkü görünürlük gizli veya opaklık 0 ise öğenin içinden görebilirsiniz.

donukluk: 0 : Eğer tıklatamaz arkasında elemanlarında.

görünürlük: gizli : arkasındaki öğelere tıklayabilirsiniz .

Arasında birçok fark vardır visibilityve opacity. Cevapların çoğu bazı farklılıklardan bahsediyor, ancak işte tam bir liste.

1. şeffaflık devralmaz, görünürlük devralır

2. şeffaflık canlandırılabilirken görünürlük değildir.
   ( Teknik olarak öyle, ancak "% 37'si daraltılmış ve% 63'ü gizli" için tanımlanmış bir davranış yoktur, bu yüzden bunu canlandırılamaz olarak düşünebilirsiniz.)

3. Opaklığı kullanarak, bir alt öğeyi üst öğesinden daha opak yapamazsınız. Örneğin, renkli: siyah ve opaklık: 0.5 olan bir ap'niz varsa, çocuklarının hiçbirini tamamen siyah yapamazsınız. Opaklık için geçerli değerler 0 ile 1 arasındadır ve bu örnek 2 gerektirir!
   Sonuç olarak, Martin'in yorumuna göre , görünmez bir ebeveynde (görünürlüğü olan: gizli) görünür bir çocuğunuz olabilir (görünürlüğü olan: görünür). Opaklıkla bu imkansızdır; bir ebeveynin opaklığı varsa: 0; çocukları her zaman görünmezdir.

4. Kornel'in cevabı , 1'den küçük opaklık değerlerinin kendi yığın bağlamlarını oluşturduğundan bahseder; görünürlük için hiçbir değer yoktur.
   (Keşke bunu göstermenin bir yolunu düşünebilseydim, ancak görünebilirliğin yığılma bağlamını göstermenin herhangi bir yolunu düşünemiyorum: gizli öğe.)

5. Göre philnash cevabı gizli elemanları değildir:, donukluk ile elementler: görünür iken 0 hala ekran okuyucular tarafından okunur.

6. Göre Chris Nuh cevap , görüş fazlası (örneğin çöküşü gibi) seçenekleri ve tıklama artık cevap görünmeyen ve sekmeli edilemez öğesi vardır.

(Bunu bir topluluk wiki yapmak, çünkü mevcut cevaplardan ödünç almak aksi takdirde adil olmaz.)

Bundan tam olarak emin değilim, ancak bence ekran okuyucuları görünürlüğü gizli olarak ayarlanan şeyleri okumazlar, ancak opaklıkları ne olursa olsun bir şeyler okuyabilirler.

Aklıma gelen tek fark bu.

Tam olarak emin değilim, ancak tarayıcılar arası şeffaflığı şu şekilde yaparım:

opacity: 0.6;
-moz-opacity: 0.6;
filter: alpha(opacity=60);

Görünürlüğü olan nesneler: gizli hala şekle sahiptir, sadece görünmezler. opaklık sıfır öğeleri yine de tıklanabilir ve diğer olaylara tepki verebilir.

Bir kullanıcı stilini oluştururken, bir contenteditable şeyi ayarlarsanız visibility: hidden, giriş imlecinin onunla gerçekten etkileşim kurmak istemediğini fark ettim . Örneğin eğer varsa

<div contenteditable><span style='visibility: hidden;'></span></div>

... o zaman o div / span'a odaklanırsanız, aslında yazamazsınız. Halbuki opacity: 0onunla yapabilirsin. Bunu kapsamlı bir şekilde test etmedim, ancak bu sayfadaki hiç kimse metin girişi üzerindeki etkilerden bahsetmediği için burada bahsetmeye değer olduğunu düşündüm. Bu muhtemelen yukarıda bahsedilen olaylarla ilgili görünüyor .

Phil'in söylediği doğru.

IE, opaklığı destekler:

filter:alpha(opacity=0);

Özelliklerin farklı anlamsal anlamları vardır. Anlamsal CSS kulağa aptalca gelebilir, ancak diğer kullanıcıların da belirttiği gibi, anlambilimin bir sayfanın erişilebilirliğini etkilediği ekran okuyucular gibi cihazlar üzerinde bir etkisi vardır.