So deaktivieren Sie die Scroll -Stange in CSS

So deaktivieren Sie die Scroll -Stange in CSS
Zweifellos spielt das Scrollen eine wichtige Rolle bei Webanwendungen. Möglicherweise benötigen Sie diese Bildlaufleiste möglicherweise irgendwann auf Ihrer Seite. Wenn der Container beispielsweise nur fünfundzwanzig Prozent einer Webseite abdeckt und links ausgerichtet ist, wird die hinzugefügte Scroll-Stange sicherlich in die Mitte gelangen. In einer solchen Situation können Sie einige CSS -Eigenschaften verwenden, um die Scroll -Leiste zu deaktivieren.

Dieser Artikel behandelt die Methode, um die Bildlaufleiste in CSS zu deaktivieren.

So deaktivieren Sie die Scroll -Stange in CSS?

Verwenden Sie die folgenden CSS -Eigenschaften, um die Bildlaufleiste auf einer Seite zu deaktivieren:

  • Überlauf-y (Vertikale Bildlaufleiste deaktivieren)
  • Überlauf-X (Horizontale Bildlaufleiste deaktivieren)
  • Überlauf (Deaktivieren Sie vertikale und horizontale Scrollstangen)

Erkunden wir die einzelnen CSS -Eigenschaften nacheinander.

Methode 1: Verwenden Sie die Überlaufeigenschaft, um die vertikale Bildlaufleiste in CSS zu deaktivieren

Der "Überlauf-yEigenschaft gibt an, was passieren wird, wenn der Inhalt nicht in Höhe des Containers passt. Es wird auch verwendet, um den Überlaufinhalt eines Elements auf Blockebene anzuzeigen und eine Bildlaufleiste hinzuzufügen oder zu deaktivieren.

Nehmen wir also ein Beispiel, um das Verfahren zur Deaktivierung der vertikalen Bildlaufleiste mit Hilfe des Überlauf-CSS-Eigentums zu überprüfen.

Beispiel

Für unsere HTML -Seite deaktivieren wir die vertikale Bildlaufleiste auf der rechten Seite:

Platzieren Sie die gewünschten HTML -Elemente, wie in unserem Fall werden wir eine Überschrift in die “hinzufügen”Tag der HTML -Datei:

Deaktivieren der Scrollbar

Um die vertikale Bildlaufleiste zu verbergen, setzen Sie die “Überlauf-y”Eigentum zu“versteckt”. Die Höhe und Breite von “200%Wird verwendet, um die Seite länger und breiter zu machen. So werden wir absichtlich die Bildlaufleisten auf unserer Seite bekommen:

Speichern Sie den angegebenen Code und führen Sie Ihre HTML -Datei im Browser aus:

Wie Sie sehen können, haben wir die vertikale Bildlaufleiste mit der Überlauf-Y-CSS-Eigenschaft erfolgreich deaktiviert.

Methode 2: Verwenden Sie die Überlauf-X-Eigenschaft, um die horizontale Bildlaufleiste in CSS zu deaktivieren

Wenn der Inhalt nicht in Breite in den Container passt, ist der “die“Überlauf-XEigenschaft wird verwendet, um solche Szenarien zu verwalten. Es legt fest. Diese CSS -Eigenschaft kann auch zur Deaktivierung der horizontalen Bildlaufleiste verwendet werden.

Beispiel

Wir werden nun die unter Highlight horizontale Bildlaufleiste unserer HTML-Seite deaktivieren:

Um die horizontale Bildlaufleiste zu verbergen, stellen Sie die “ein"Überlauf-X Zu "versteckt”Und fügen Sie den Wert der Höhe und der Breite hinzu, wie im vorherigen Beispiel angegeben:

Ausgang

Sie möchten sowohl horizontale als auch vertikale Balken gleichzeitig deaktivieren wollen? Wenn ja, befolgen Sie den nächsten Abschnitt!

Methode 3: Verwenden Sie die Überlaufeigenschaft, um vertikale und horizontale Bildlaufleisten in CSS zu deaktivieren

Wenn der Inhalt nicht horizontal und vertikal in den Behälter passt, ist der “Überlauf”Eigenschaft gibt an, ob Scroll -Balken hinzugefügt oder den Inhalt geschnitten werden sollen. Sie können diese CSS -Eigenschaft auch verwenden, um vertikale und horizontale Schriftrollen gleichzeitig zu deaktivieren.

Beispiel

In derselben HTML -Datei werden wir die "hinzufügen"Überlauf”Eigenschaft und zuweisen Sie es eine“versteckt" Wert. Dadurch wird die Bildlaufleiste für beide Orte horizontal und vertikal deaktiviert:

Ausgang

Wir haben Anweisungen zum Deaktivieren von Scrollbalken mit verschiedenen CSS -Eigenschaften angeboten.

Abschluss

Um Scrollstangen in CSS zu deaktivieren, können Sie verwenden “Überlauf-X","Überlauf-y", und das "Überlauf" Eigenschaften. Die Überlauf-X-Eigenschaft wird speziell zur Deaktivierung der vertikalen Bildlaufleiste und der Überlaufeigenschaft verwendet, um horizontale Scroll-Stangen zu deaktivieren. Darüber hinaus hilft Überlaufeigenschaften dabei, vertikale und horizontale Balken sofort zu deaktivieren. In diesem Artikel wurden die Methoden zur Deaktivierung von Scroll -Balken in CSS erörtert.