Come posso aggiungere una barra di scorrimento verticale al mio div automaticamente

Un contenitore di div in HTML può avere più elementi e sotto-elementi e ha una dimensione specifica. Quindi, a volte è necessario aggiungere una barra di scorrimento con il contenitore div quando gli elementi superano il limite di dimensioni del div o quando non si adattano correttamente al contenitore div.

Questo articolo discuterà il metodo utile per aggiungere una barra di scorrimento verticale al Div automaticamente utilizzando HTML e CSS.

Come aggiungere una barra di scorrimento verticale al div?

Gli sviluppatori possono aggiungere scorrini verticali al Div applicando il "Overflow-y: scorrimento"Proprietà insieme ad alcune altre proprietà CSS sull'elemento del contenitore Div.

Esempio

Capiamolo con un semplice esempio creando prima un "div"Container con alcuni elementi HTML al suo interno e quindi applicando il CSS"overflow"Proprietà per aggiungere una barra di scorrimento verticale con il div:

Di seguito sono riportati alcuni famosi front-end e back-end
le lingue:

Pitone

JavaScript

Giava

PHP

C#

Andare

Swift

Rubino

Matlab

Dattiloscritto

Scala

Html

CSS

Ruggine

Perl

SQL

R

NoSQL

C

C++

Nel frammento di codice sopra:

• UN ""L'elemento è stato aggiunto con una classe dichiarata come"Barra di scorrimento".
• IL ""Il contenitore ha un elenco di venti lingue front-end e back-end.

Ora, è necessario applicare le proprietà CSS al Div aggiungendo il selettore di classe:

.Barra di scorrimento

overflow-y: scroll;
Max-Height: 200px;
Licromra massima: 300px;
Testo-align: centro;
Background-color: Azure;

Nel suddetto frammento di codice CSS:

• IL "overflow-y"Proprietà con il valore"scorrere"Viene aggiunto per creare una barra di scorrimento verticale per il div.
• Dopodiché, il "altezza massima"Del contenitore di div è stato definito come"200px" e il "larghezza massima"È stato definito come"300px".
• Il valore del "allineamentoLa proprietà "è impostata come"centro"Per allineare gli oggetti all'interno del Div al centro. Questo viene fatto solo per fare una migliore presentazione del contenitore div.
• Il colore di sfondo per il div è stato definito come "azzurro"Ciò differenzierà l'aspetto del contenitore Div dal resto dello schermo.

Di conseguenza, verrà creato il contenitore Div e avrà una barra di scorrimento verticale sul lato destro:

Ecco come possiamo aggiungere una barra di scorrimento verticale a un div automaticamente.

Conclusione

La barra di scorrimento verticale può essere aggiunta automaticamente a un Div facendo riferimento all'elemento Div tramite un ID o un selettore di classe nell'elemento in stile CSS e quindi applica il "Overflow-y: scorrimento"Proprietà all'elemento Div. I parametri della barra di scorrimento appariranno secondo le altre proprietà aggiunte come "altezza massima" E "larghezza massima"Del contenitore Div. Questo blog è una guida informativa sul metodo per l'aggiunta di una barra di scorrimento verticale a un div.