Hvordan endre bakgrunnsfargen på en HTML-tabell

click fraud protection

Hva du skal vite

  • Enklest: legg til stilegenskapen bakgrunnsfarge til tabellen, raden eller cellekoden.
  • Neste enkleste: bruk attributtet bgfarge.

Denne artikkelen forklarer metodene for å endre bakgrunnsfargene til deler av et bord på et nettsted.

Datamaskript HTML i oransje og blå type med svart bakgrunn

Den eldre metoden brukte attributtet bgfarge for å endre bakgrunnsfargen på et bord. Det kan også brukes til å endre fargen på en tabellrad eller en bordcelle. Men attributtet bgcolor er utfaset til fordel for stilark, så det er ikke den optimale måten å manipulere et bords bakgrunnsfarge på.

Den bedre måten å endre bakgrunnsfargen på er å legge til stilegenskapen bakgrunnsfarge til tabellen, raden eller cellekoden.

Dette eksemplet endrer bakgrunnsfargen på en hel tabell:


Hvis du vil endre fargen på en enkelt rad, setter du inn bakgrunnsfargeegenskapen i.


Du kan endre fargen på en enkelt celle ved å legge til attributtet til.


Du kan også bruke bakgrunnsfarger på bordhoder eller


Endre bakgrunnsfarge ved hjelp av stilark

Det er imidlertid bedre å unngå å bruke bakgrunnsfarge-attributtet til fordel for et korrekt formatert stilark. For eksempel kan du sette stilene i et stilark i HEAD av HTML-dokumentet eller sette dem i en

instagram viewer
eksternt stilark. Endringer som disse i HEAD eller et eksternt stilark kan se ut som disse for tabeller, rader og celler:

tabell {bakgrunnsfarge: # ff0000; }
tr {bakgrunnsfarge: gul; }
td {bakgrunnsfarge: # 000; }

Innstilling av kolonnens bakgrunnsfarge

Den beste måten å stille bakgrunnsfargen til en kolonne på er å lage en stilklasse og tilordne den deretter til kolonnens celler. Ved å lage en klasse kan du tilordne den klassen til cellene i en bestemt kolonne ved hjelp av ett attributt.

CSS:

td. ColColor {bakgrunnsfarge: blå; }

HTML:


celle 1celle 2celle 1celle 2

En betydelig fordel med å kontrollere bakgrunnsfarger gjennom et stilark er at du kan endre fargevalget ditt senere. I stedet for å gå gjennom HTML-dokumentet og gjøre endringen i hver enkelt celle, kan du gjøre en enkelt endring i fargevalget i CSS som umiddelbart blir brukt på alle tilfeller der class = "ColColor" syntaksen vises.

Selv om du blander inn CSS i HTML-en din, eller kaller en egen CSS-fil, legger du til litt administrativ overhead utover bare å endre et HTML-attributt, vil du oppdage at det å stole på CSS reduserer feil, fremskynder utviklingen og forbedrer portabiliteten til din dokument.

instagram story viewer