Skip to main content

Kako spremeniti barvo ozadja tabele

Anonim

Metoda za spreminjanje barv ozadja delov tabele na spletnem mestu se je v preteklih letih spremenila, postala je lažja in manj delovno intenzivna z uvedbo slogovnih listov.

Starejša metoda je uporabila atribut bgcolor, če želite spremeniti barvo ozadja tabele. Lahko se uporablja tudi za spreminjanje barve vrstice tabele ali celice tabele. Toda atribut bgcolor je bil opuščen v korist slogovnih listov, zato ni optimalen način za manipulacijo barve ozadja tabele.

Boljši način spreminjanja barve ozadja je dodati barvo ozadja v slogu v tabelo, vrstico ali celično oznako.

To bo spremenilo barvo ozadja celotne tabele:

Če želite spremeniti barvo ene vrstice, vstavite lastnost barve v ozadju

oznaka:

Barvo posamezne celice lahko spremenite tako, da dodate atribut na

oznaka:

Barve ozadja lahko uporabite tudi za glave stolpcev ali

na enak način:

Spremeni barvo ozadja s pomočjo slogov

Če ne želite dodati barve ozadja v slogu v tabelo, obstajajo nadomestni načini za nastavitev barve ozadja. Sloge lahko na primer nastavite v slogovni obliki na glavi dokumenta HTML ali jih nastavite v zunanji slogovni list. Spremembe teh v glavi ali v zunanjem slognem listu se morda zdijo takšne za tabele, vrstice in celice:

tabela {background-color: # ff0000; } tr {ozadje-barva: rumena; } td {barva ozadja: # 000; }

Nastavi barvo ozadja stolpca

Najboljši način za nastavitev barve ozadja za stolpec je ustvariti razred sloga in nato dodeliti ta razred celicam v tem stolpcu. Ustvarjanje razreda vam omogoča, da dodelite ta razred celicam v določenem stolpcu z uporabo enega atributa.

CSS:

td.ColColor {background-color: blue; }

HTML:

celica 1celica 2
celica 1celica 2

Ena pomembna prednost nadzora barv ozadja skozi slogovni list je možnost, da pozneje spremenite svojo barvo. Namesto da bi morali iti skozi HTML dokument in spremeniti vsako posamezno celico, lahko naredite eno samo spremembo barvne izbire v CSS-u in ga takoj uporabite za vsak primer, v katerem se uporablja razred = "ColColor". To prihrani ogromne količine časa in močno zmanjšuje možnosti napak, na primer manjkajoče spremembo barve celice.

Tudi če nikoli prej niste spremenili barve ozadja tabele v spletnem dokumentu prej, lahko kopirate zgornje primere in sami preizkusite s to metodo. Hitro boste ugotovili, kako preprosto je, da spremembe barv uporabite s slogovnimi oznakami, še posebej s sloganskimi listi, če delate z velikimi spletnimi mesti. Preizkusite različne predstavljene možnosti in izberite tistega, ki je na koncu najbolj udoben za vas.