2010-08-26 12 views
9

Ich habe ein Div, das ich verwende, um Warnungen anzuzeigen, wenn benötigt.CSS-Anzeige: keine und Sichtbarkeit: ausgeblendet

Wenn ich es nach einer Weile schließen möchte kann ich display: none oder sollte ich display: none sowie Sichtbarkeit: versteckt?

Also eins oder beides.

Vielen Dank.

+0

display: none nur – Tommy

Antwort

18

Hängt davon ab. Wenn der Platz leer bleiben soll, dh der Raum wird nicht von anderen Elementen darunter oder um ihn herum eingenommen, benötigen Sie visibility: hidden. Andernfalls verwenden Sie display: none, wodurch andere Elemente in den Bereich des Elements verschoben werden können.

Es gibt keinen Grund, beides zu verwenden.

6

Sichtbarkeit: versteckt verbirgt das Element, aber es nimmt immer noch Platz im Layout ein. Anzeige: Keine entfernt es vollständig.

In Ihrem Fall würde ich Anzeige verwenden: keine

+1

gut funktionieren keine Anzeige: versteckt, gibt es Sichtbarkeit: versteckt :) – Sotiris

+0

Das ist, was ich für das Schreiben erhalten, bevor Kaffee! Danke für den Fang, ich habe meinen Beitrag aktualisiert. :) – Chuck

6

Wenn Sie versteckt ist mit Screenreadern zugänglich — die sein muss, zum Beispiel — dann sollten Sie nicht display: none oder visibility: hidden verwenden, da beide potenziell verstecken Inhalte von Bildschirmlesern. Stattdessen sollten Sie einen besser zugänglichen Ansatz verwenden, z. B. den Inhalt mit einem negativen Rand außerhalb des Bildschirms verschieben. Auch die folgenden Links für weitere Informationen:

456 Berea Street: Hiding with CSS: Problems and solutions
WebAIM Blog: Hiding content for screen readers

+1

Nur neugierig, aber warum genau möchten Sie Inhalte ausblenden, aber immer noch für Screenreader zugänglich sein? Wenn es versteckt ist, liegt es daran, dass ich es momentan nicht sehen möchte. – Maverick

+1

@ MrN00b Sie können Inhalte aus ästhetischen Gründen ausblenden, z. B. zusammenklappbare Abschnitte, die der Benutzer verbergen oder anzeigen kann. – Mike