Manchmal ist es beim Layout einer Webseite notwendig, einige der darin platzierten Elemente auszublenden. Wenn Sie beispielsweise möchten, dass der Besucher die Schaltflächen zum Absenden des Formulars erst dann sieht, wenn alle erforderlichen Felder ausgefüllt sind. Oder wenn die Schaltfläche vom Besucher überhaupt nicht verwendet werden soll, das auf dieser Seite platzierte Skript jedoch "klicken" soll.
Anweisungen
Schritt 1
Verwenden Sie die display-Eigenschaft des Cascading Style Sheets (CSS), um die Anzeige der gewünschten Seitenelemente ein- oder auszuschalten. Nach internationalen Standards können dieser Eigenschaft mehr als eineinhalb Dutzend Werte zugewiesen werden, die unterschiedliche Anzeigemethoden angeben. Allerdings sind nur vier browserübergreifend (d. h. funktionieren in allen gängigen Browsern). Unter diesen vier gibt es den Wert none, den Sie benötigen, mit dem Sie das gewünschte Seitenelement ausblenden können.
Schritt 2
Erstellen Sie die erforderlichen CSS-Richtlinien. In seiner einfachsten Form kann es so aussehen: button {display: none;} In diesem Fall zeigt die Seite nicht alle Schaltflächen an, die das Tag… verwenden.
Schritt 3
Fügen Sie in den Anweisungen einen Hinweis zum Klassennamen hinzu, wenn Sie nur eine Schaltfläche oder eine bestimmte Gruppe von Schaltflächen ausblenden möchten. Benennen Sie beispielsweise eine solche Klasse HideBtns und fügen Sie diesen Namen in die CSS-Anweisung ein: button. HideBtns {display: none;} Fügen Sie das Klassenattribut zum gewünschten Button im HTML-Code der Seite hinzu und weisen Sie ihm den Wert HideBtns zu: hidden button
Schritt 4
Wenden Sie die display-Eigenschaft mit dem Wert none auf das übergeordnete Element an, wenn Sie beispielsweise nicht nur die Schaltfläche, sondern auch andere Elemente des Webformulars ausblenden möchten. Das Formular gilt als "Elternteil" aller Elemente, die zwischen den Tags und platziert werden. Beispielsweise:
Hier werden im Formular ein Textfeld und eine Schaltfläche zum Absenden des eingegebenen Wertes platziert. Das Formular ist einer Klasse namens HideForm zugewiesen. Um sowohl das Eingabefeld als auch die Schaltfläche auszublenden, müssen Sie die CSS-Anweisung wie folgt ändern: form. HideForm {display: none;}
Schritt 5
Platzieren Sie den vorbereiteten Code aus dem obigen Beispiel in der Kopfzeile des Webdokuments (zwischen den und -Tags). Um dem Browser des Besuchers mitzuteilen, dass es sich um CSS-Code handelt, muss er zwischen den öffnenden und schließenden HTML-Style-Tags eingeschlossen werden:
button. HideBtns {Anzeige: keine;}
