Hat die Deckkraft: 0 genau die gleiche Wirkung wie die Sichtbarkeit: verdeckt

Wenn ja, ist es effektiv verbitten sich die visibility Eigenschaft?

(Mir ist klar, dass der Internet Explorer noch nicht unterstützt werden, dieses CSS2-Eigenschaft.)


Vergleiche von layout-engines

Siehe auch: Was ist der Unterschied zwischen visibility:hidden und display:none

InformationsquelleAutor der Frage Chris Noe | 2008-11-07

  1. 216

    Hier ist eine Zusammenstellung der überprüften Informationen aus den verschiedenen Antworten.

    Jede dieser CSS-Eigenschaften ist in der Tat einzigartig. Zusätzlich zur Darstellung ein element nicht sichtbar, haben Sie die folgenden zusätzlichen Effekt(s):

    1. Zusammenbricht der Raum, den das element normalerweise einnehmen
    2. Reagiert auf Veranstaltungen (z.B. Mausklick, Tastendruck)
    3. Beteiligt sich an der taborder
     Zusammenbruch Veranstaltungen taborder 
Deckkraft: 0 Nein ja ja 
visibility: hidden Nein Nein Nein 
Sichtbarkeit: Zusammenbruch * Nein Nein 
Anzeige: keine ja Nein Keine 

* Ja innerhalb einer Tabelle, element, sonst Keine.

    InformationsquelleAutor der Antwort Chris Noe

  2. 11

    Nicht.

    Elemente mit Deckkraft-erstellen neuer stacking-context.

    Ebenfalls, CSS-Spezifikation nicht definieren, aber Elemente mit opacity:0 anklickbar sind, und Elemente mit visibility:hidden nicht.

    InformationsquelleAutor der Antwort Kornel

  3. 10

    Nein das tut es nicht. Es ist ein großer Unterschied.
    Sie sind ähnlich, weil Sie sehen können, durch das element, wenn Sichtbarkeit ist hidden oder opacity 0 ist, jedoch

    opacity: 0 : Sie können nicht klicken Sie auf auf Elemente dahinter.

    visibility: hidden : können Sie auf auf Elemente dahinter.

    InformationsquelleAutor der Antwort Nishant

  4. 4

    Ich bin nicht ganz sicher, aber das ist wie ich tun cross-browser-Transparenz:

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

    Objekte mit Visibility:hidden noch eine Form haben, die Sie gerade nicht sichtbar. Deckkraft-null-Elemente kann immer noch angeklickt werden, und reagieren auf andere Ereignisse.

    InformationsquelleAutor der Antwort Andrew Bullock

  5. 3

    Ich bin mir nicht ganz sicher, aber ich denke, dass Bildschirmlesehilfen nicht gelesen Dinge, die festgelegt werden, um Sichtbarkeit versteckt, aber Sie können Lesen, was unabhängig von Ihrer Deckkraft.

    Das ist der einzige Unterschied, den ich denken kann.

    InformationsquelleAutor der Antwort philnash

  6. 2

    Gleichzeitig einen userstyle, dass wirkt sich auf Elemente in einem contenteditable bemerkte ich, dass, wenn Sie etwas zu visibility: hiddendann wird der Eingabe-Cursor will nicht wirklich mit ihm zu interagieren. ZB wenn Sie 

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

    ...dann scheint es, wenn Sie sich das div/span, kann man eigentlich nicht geben. In der Erwägung, dass mit opacity: 0 es scheint, Sie können. Ich habe nicht getestet, die ausgiebig, aber dachte, es war es Wert zu erwähnen, das hier sonst niemand auf dieser Seite hat, Sprach über die Auswirkungen auf die Texteingabe. Dies scheint möglicherweise im Zusammenhang mit der Veranstaltungen Sachen, die oben erwähnt aber.

    InformationsquelleAutor der Antwort MalcolmOcean

  7. 1

    Gibt es viele Unterschiede zwischen visibility und opacity. Die meisten Antworten nennen Sie einige Unterschiede, aber hier ist eine vollständige Liste.

    1. Deckkraft nicht Erben, während die Sichtbarkeit hat

    2. Deckkraft animiert werden, während die Sichtbarkeit nicht ist.

      (Gut, technisch es ist, aber es ist einfach kein Verhalten definiert, für, sagen wir, "37% zusammengebrochen und 63% versteckt", so betrachten Sie diese als nicht animierbar.)

    3. Mithilfe der Deckkraft können Sie nicht machen ein Kind-element undurchsichtiger als seine Eltern. E. G. wenn Sie ein p mit Farbe:schwarz Deckkraft:0.5, kann man nicht alle seine Kinder, die voll schwarz. Gültige Werte für Deckkraft zwischen 0 und 1, und in diesem Beispiel würde erfordern, 2!

      Dementsprechend, nach Martin ' s Kommentar, können Sie eine sichtbare Kind (mit visibility:visible) in einen unsichtbaren parent (mit visibility:hidden). Dies ist unmöglich mit Deckkraft; wenn ein Elternteil die Deckkraft:0; seine Kinder sind immer unsichtbar.

    4. Kornel Antwort erwähnt, dass die Deckkraft-Werte von weniger als 1 erstellen Sie Ihre eigene stacking-context; kein Wert für die Sichtbarkeit hat.

      (Ich wünschte, ich könnte denken, ein Weg, um dies zu zeigen, aber ich kann mir nicht vorstellen, dass es eine Mittel, um zu zeigen das stapeln Kontext des visibility:hidden element.)

    5. Laut philnash AntwortElemente mit opacity:0 noch von Bildschirmleseprogrammen vorgelesen, während visible:hidden-Elemente nicht.

    6. Laut Chris Noe ' s AntwortSichtbarkeit mehr Optionen hat (z.B. Kollaps) und Elemente, die nicht sichtbar sind, nicht mehr reagieren auf Klicks und nicht auf Registern angezeigt werden.

    (So dass dies ein community-wiki, da borrowing aus den vorhandenen Antworten wäre nicht fair sonst.)

    InformationsquelleAutor der Antwort

  8. 0

    Was Phil sagt ist wahr.

    IE unterstützt die Deckkraft aber:

    filter:alpha(opacity=0);

    InformationsquelleAutor der Antwort Diodeus - James MacFarlane

  9. 0

    Eigenschaften haben unterschiedliche semantische Bedeutungen. Während semantische CSS-klingt wie mag es albern sein, als andere user erwähnt haben, hat es Auswirkungen auf Geräte wie screen-Reader-wo Semantik Auswirkungen auf die Barrierefreiheit einer Seite.

    InformationsquelleAutor der Antwort Zack The Human

Schreibe einen Kommentar