Beispielcode zum Anzeigen einer Bildlaufleiste nach dem Verkleinern der HTML-Seite

Hier erfahren Sie, wie Sie nach der Verkleinerung der HTML-Seite unten eine Bildlaufleiste einblenden, sodass Sie mit der Bildlaufleiste scrollen und in den Bereichen blättern können, die von der verkleinerten Benutzeroberfläche abgedeckt werden.

Sprechen Sie über die Vorteile, die sich daraus ergeben.

Erstens ist es im Allgemeinen so, dass bei einer Verkleinerung der Benutzeroberfläche keine Bildlaufleiste angezeigt wird und Benutzer nicht auf versteckte Bereiche zugreifen können. Daher muss die Benutzeroberfläche vergrößert werden.

Zweitens wird aufgrund des relativen oder absoluten Layouts einiger Schnittstellen die Schnittstelle rechts nach unten verschoben, wenn die Schnittstelle kleiner wird, was das Schnittstellenlayout unansehnlich machen kann. Die sorgenfreieste Methode besteht darin, die Bildlaufleiste nach dem Verkleinern anzuzeigen.

Die Implementierung ist sehr einfach, nur ein paar Zeilen Code

Körper{
    Mindestbreite: 1200px;
    Überlauf: scrollen;
    /*maximale Breite:100%;*/
}

Wissenspunkterweiterung:

Die Bildlaufleiste wird automatisch angezeigt, wenn die HTML-Seite verkleinert wird

Importieren Sie einfach diesen Stil und legen Sie die Attribute im Textkörper nach Bedarf fest.

<Stil>

Körper{
  Rand: 0px;
  Breite: 100 %;
  Mindestbreite: 1500px;
  maximale Breite: 100 %;
  Höhe: 100 %;
  Hintergrundfarbe: #F0F0F0;
}
#Kopf{
  Hintergrundfarbe: #FFFF00;
  Breite: 100 %;
  Höhe: 100px;
}
#Center{
  Hintergrundfarbe: #00FFFF;
  Breite: 100 %;
  Mindesthöhe: 100 %;
}
#Fuß{
  Hintergrundfarbe: #FF00FF;
  Breite: 100 %;
  Höhe: 100px;
}
</Stil>

Dies ist das Ende dieses Artikels über den Beispielcode zum Anzeigen einer Bildlaufleiste, wenn die Größe der HTML-Seite verkleinert wird. Weitere verwandte Inhalte zum Anzeigen einer Bildlaufleiste, wenn die Größe der HTML-Seite verkleinert wird, finden Sie in früheren Artikeln auf 123WORDPRESS.COM oder in den verwandten Artikeln weiter unten. Ich hoffe, dass jeder 123WORDPRESS.COM in Zukunft unterstützen wird!