Det er nemt at gøre en div lodret rullebar ved at bruge CSS-overløbsegenskaben. Der er forskellige værdier i overløbsejendom . Vi kan bruge den egenskab til at få en rullepanel på en webside. De nedenfor nævnte eksempler er måderne til at indstille en lodret rullepanel på en webside.

Eksempel 1: I dette eksempel har vi sat overflow-x: skjult; og overløb-y: auto; som automatisk skjuler den vandrette rullepanel og kun viser den lodrette rullepanel.

html

> <> html> >> <> head> >> > <> style> >> > h1 {> > color: Green;> > }> > div.scroll {> > margin: 4px, 4px;> > padding: 4px;> > background-color: green;> > width: 500px;> > height: 110px;> > overflow-x: hidden;> > overflow-y: auto;> > text-align: justify;> > }> > style>hovedet>

`techcodeview.comh1>`
Det er en god platform til at lære programmering. Det er en pædagogisk hjemmeside. Forbered dig på rekrutteringsindsatsen for produktbaserede virksomheder som Microsoft, Amazon, Adobe osv. med et gratis online kursusforberedelseskursus. Kurset fokuserer på forskellige MCQ's og kodningsspørgsmål, der sandsynligvis vil blive stillet i interviewene og gør din kommende placeringssæson effektiv og vellykket. Alle nørder kan også hjælpe andre nørder ved at skrive artikler på techcodeview.com, publicering af artikler følger nogle få trin, der er Artikler, der har brug for lidt ændring/forbedring fra anmeldere, udgives først. For hurtigt at få dine artikler gennemgået, skal du henvise til eksisterende artikler, deres formateringsstil, kodningsstil, og forsøge at få dig til at være tæt på dem. Hvis du er nybegynder, kan du henvise til retningslinjer for at skrive en artikel div> center> body> html>>

Produktion:

Produktion

Eksempel 2: I dette eksempel skal du bruge auto i stedet for overflow-x:hidden; og overløb-y:auto; for at gøre div lodret rullebar.

html

> <> html> >> <> head> >> > <> style> >> > h1 {> > color: Green;> > }> > div.gfg {> > margin: 5px;> > padding: 5px;> > background-color: green;> > width: 500px;> > height: 110px;> > overflow: auto;> > text-align: justify;> > }> > style>hovedet>