Come fare per - Nascondi la barra di scorrimento
Scopri come nascondere le barre di scorrimento con i CSS.
Come nascondere le barre di scorrimento
Aggiungi overflow: hidden;
per nascondere la barra di scorrimento orizzontale e verticale.
Esempio
body {
overflow: hidden; /* Hide scrollbars */
}
Per nascondere solo la barra di scorrimento verticale o solo la barra di scorrimento orizzontale, utilizzare overflow-y
o overflow-x
:
Esempio
body {
overflow-y: hidden; /* Hide vertical scrollbar */
overflow-x: hidden; /* Hide horizontal scrollbar */
}
Nota che overflow: hidden
rimuoverà anche la funzionalità della barra di scorrimento. Non è possibile scorrere all'interno della pagina.
Suggerimento: per saperne di più sulla overflow
proprietà, vai al nostro CSS Overflow Tutorial o CSS Overflow Property Reference .
Nascondi le barre di scorrimento ma mantieni la funzionalità
Per nascondere le barre di scorrimento, ma continuare a scorrere, puoi utilizzare il seguente codice:
Esempio
/* Hide scrollbar for Chrome, Safari and Opera */
.example::-webkit-scrollbar {
display: none;
}
/* Hide scrollbar
for IE, Edge and Firefox */
.example {
-ms-overflow-style: none; /*
IE and Edge */
scrollbar-width: none; /* Firefox */
}
I browser Webkit, come Chrome, Safari e Opera, supportano lo pseudoelemento non standard ::-webkit-scrollbar
, che ci consente di modificare l'aspetto della barra di scorrimento del browser. IE ed Edge supportano la -ms-overflow-style:
proprietà e Firefox supporta la scrollbar-width
proprietà, che ci consente di nascondere la barra di scorrimento, ma di mantenere la funzionalità.