Slik formaterer du en Scrollbar i CSS

Når nettstedet ditt lastes inn i en nettleser, viser nettleseren automatisk scrollbar i en bestemt farge som blå. Hvis du finner denne skyggen passer ikke til design layout av nettstedet ditt, eller hvis du bare ønsker å tilpasse sidene dine, har du muligheten til å formatere den med Cascading Style Sheets (CSS). Med datamaskinens tekst editor program, kan du bruke CSS for å style den scrollbar som du foretrekker.

Bruksanvisning

1 Start tekst editor program og åpne web-dokument som har rullefeltet du vil formatere.

2 Skriv inn følgende CSS-kode etter åpningen <head> element:

<Style type = "text / css">

</ Style>

3 Skriv inn "body {}" mellom stil koder for å definere en stil for rullefeltet på nettleseren. Å illustrere:

kropp { }

Kroppen regelen styrer den generelle utseendet på siden din.

4 Type "scrollbar-basefarge:;" mellom klammeparenteser og følg denne med en heksadesimal fargeverdi for å definere de viktigste fargen på rullefeltet. Den komplette CSS-kode ser ut som følgende eksempel:

body {scrollbar-basen-color: # 606060; }

CSS regelen brukes automatisk rullefeltet som grenser et nettleservindu Web når området er lastet.

5 Lagre filen og forhåndsvise arbeidet i en nettleser. Din scrollbar viser nå i den tildelte skyggen.

Hint

  • Hvis du har andre HTML-elementer på siden din, for eksempel en tabell som har en scrollbar, gjenta trinnene for å opprette en egen regel som formaterer bar i dette området. For eksempel:
  • table {scrollbar-basen-color: #cccccc; }