So stellen Sie sicher, dass die Bildlaufleiste in CSS nicht angezeigt wird-CSS-Tutorial-php.cn

So stellen Sie sicher, dass die Bildlaufleiste in CSS nicht angezeigt wird

醉折花枝作酒筹

Freigeben： 2023-01-06 11:16:01

Original

14479 Leute haben es durchsucht

In CSS können Sie den Pseudoklassenselektor „::-webkit-scrollbar“ verwenden, um die Bildlaufleiste auszuwählen, und dann den Stil „display:none“ verwenden, um die Bildlaufleiste nicht anzuzeigen. Das spezifische Syntaxformat lautet „; ::-webkit-scrollbar {display:none;}".

So stellen Sie sicher, dass die Bildlaufleiste in CSS nicht angezeigt wird

Die Betriebsumgebung dieses Tutorials: Windows7-System, CSS3- und HTML5-Version, Dell G3-Computer.

::-webkit-scrollbar Der CSS-Pseudoklassenselektor beeinflusst den Stil der Bildlaufleiste eines Elements. Wir können die Anzeigeeigenschaft des ::-webkit-scrollbar-Selektors auf „none“ setzen, um die Bildlaufleiste auszublenden.

So stellen Sie ein, dass die Bildlaufleiste nicht angezeigt wird:

<!DOCTYPE html>
<html>
   <head>
       <meta charset="UTF-8">
       <title></title>
   </head>
   <body>
       <div style=" width:200px;   height: 200px;  overflow-y: scroll;">
           cmcc</br>
           cmcc</br>
           cmcc</br>
           cmcc</br>
           cmcc</br>
           cmcc</br>
           cmcc</br>
           cmcc</br>
           cmcc</br>
           cmcc</br>
           cmcc</br>
           cmcc</br>
           cmcc</br>
           cmcc</br>
       </div>
   </body>
</html>

Nach dem Login kopieren

Rendering:

Vor dem Festlegen des CSS-Effekts:

So stellen Sie sicher, dass die Bildlaufleiste in CSS nicht angezeigt wird

Nach dem Hinzufügen des CSS-Stils:

Code

<style>
     ::-webkit-scrollbar {display:none}
</style>

Nach dem Login kopieren

Verwenden Sie CSS, um die Bildlaufleiste nicht anzuzeigen um den Effekt anzuzeigen:

So stellen Sie sicher, dass die Bildlaufleiste in CSS nicht angezeigt wird

CSS-Bildlaufleistenauswahl:

::-webkit-scrollbar – die gesamte Bildlaufleiste
::-webkit-scrollbar-button – die Schaltfläche auf der Bildlaufleiste (nach oben und unten). Pfeile)
: :-webkit-scrollbar-thumb – Bildlaufleiste auf Scroll-Schieberegler
::-webkit-scrollbar-track – Bildlaufleistenspur
::-webkit-scrollbar-track-piece – Bildlaufleiste verschiebt sich nicht Der Spurteil des Blocks
::-webkit-scrollbar-corner – Der Teil, der zusammentrifft, wenn sowohl vertikale als auch horizontale Bildlaufleisten vorhanden sind
::-webkit-resizer – Der Teil des Eckteils bestimmter Elemente Stil (Beispiel: ziehbare Schaltfläche des Textbereichs)

Empfohlenes Lernen: CSS-Video-Tutorial

Das obige ist der detaillierte Inhalt vonSo stellen Sie sicher, dass die Bildlaufleiste in CSS nicht angezeigt wird. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!