Hvordan lage html -bord vertikalt rullbar

Martin Berge
Hvordan lage html -bord vertikalt rullbar
HTML er et markeringsspråk som hjelper utviklere med å lage et interaktivt nettsted, og CSS -egenskaper brukes til å gjøre dem mer responsive. Det kan også bestemme hvordan nettstedets elementer skal vises. Mer spesifikt, gjennom HTML -tabeller, kan brukere også opprette og lagre omfattende data i rader og kolonner. HTML lar deg også bla rader og kolonner vertikalt.

Dette innlegget vil forklare metoden for å gjøre HTML -tabellen vertikalt rullbar.

Hvordan lage html -bord vertikalt rullbar?

For å lage en tabell vertikalt rullbar i HTML, først, lage en tabell og legge til relevante data. Bruk deretter CSS -egenskapene “Overflow-X”Og“Overflow-y”.

Egenskapen "Overflow-X" med verdien "skjult”Klemmer overløpet. Dessuten egenskapen "Overflow-y" med verdien "bla”Vil tillate deg å bla opp og ned på bordet.

For å gjøre det, prøv de gitte instruksjonene.

Trinn 1: Lag en "div" -beholder

Først av alt, lage en “”Container. Sett deretter inn en klasseattributt som en "Div-Scroll”.

Trinn 2: Lag en tabell i HTML

For å lage en tabell i HTML, følg de medfølgende instruksjonene:

  • Lag et bord ved å bruke "" stikkord.
  • Sett "grense" som "1px”Og juster bordet i sentrum ved å bruke“tilpasse" Egenskap.
  • “
    • ”Taggen brukes til å spesifisere radene i tabellen.
  • “
    • ”Tag brukes til å legge overskriften til bordet.
  • “
    		• ”Brukes for å sette inn data i tabellen:










    Navn Id Kategori
    Jenny 01 Docker
    Herry 02 HTML/CSS
    Gifte seg 03 Git
    Jazzy 04 JavaScript
    Edward 05 Vinduer
    Bella 06 Uenighet
    kanin 07 Git
    Jack 08 HTML/CSS

    Det kan observeres at tabellen er opprettet med hell:

    Trinn 3: Tilgangsklasse og tabell

    Få tilgang til “div”Element ved å bruke“.Div-Scroll" klassenavn. “bord”Brukes til å få tilgang til bordelementet i DIV -beholderen.

    Trinn 4: Stilbord i CSS

    For å style bordet i CSS, bruk følgende egenskaper:

    .Div-Scroll, Table
    polstring: 12px;
    Høyde: 200px;
    Bredde: 500px;
    Border-Radius: 10px;
    Bokseskygge: 1px 2px 1px 2px RGB (230, 229, 229);
    Margin: 15px;
    Border: 1px Solid #141313;
    Bakgrunnsfarge: #CBEAF8;
    Overflow-y: Rull;
    Overflow-X: Skjult;

    Her er beskrivelsen av ovennevnte kode:

    • “polstring”Eiendom brukes til å sette plassen rundt elementet.
    • “høyde”Definerer elementhøyden som er satt som“200px”.
    • “bredde”Angir elementbredden.
    • “Border-Radius”Definerer elementets radius. Det lar brukeren legge til et avrundet hjørne til elementet.
    • “Bokseskygge”Eiendom setter skyggerammen rundt elementet.
    • “margin”Brukes til å sette plassen rundt elementet.
    • “grense”Eiendom blir lagt til for å sette en grense.
    • “bakgrunnsfarge”Funksjonen brukes til å sette fargen på tabellen på baksiden.
    • “Overflow-y”Er satt som“bla”For å gjøre det vertikalt rullbar.
    • “Overflow-X”Angir verdien som“skjult”.

    Det kan observeres at vi har gjort bordet vertikalt rullelig:

    Vi har forklart metoden for å gjøre bordet vertikalt rullbar.

    Konklusjon

    For å gjøre HTML -tabellen vertikalt rullbar, lag først bordet ved å bruke "

    " stikkord. Bruk deretter CSS -egenskaper for å style bordet. Sett dessuten verdien av "Overflow-X”Eiendom som“skjult”Og“Overflow-y" som "bla”For å få bordet rullbar. Dette innlegget har gitt prosedyren for å gjøre bordet vertikalt rullbar.

    Python
    Seaborn Axis -etiketter
    “Aksene.set () ”-funksjon, matplotlib bibliotekfunksjoner, eller“ set_xlabel () ”og“ set_ylabel () ”...
    Daniel Johnsen
    Python
    Python Chmod
    “OS.CHMOD () ”-funksjonen til OS -modulen brukes til å endre eierskapet til Python -filen ved å godt...
    Anders Fjeld Moe
    Golang
    Hva er strukturer i Golang
    I Golang er en struktur en sammensatt datatype som består av null eller flere navngitte felt, som hv...
    Erik Røed