Jak změnit barvu pozadí tabulky HTML

Tento článek vysvětluje metody pro změnu barvy pozadí částí tabulky na webu.

Starší metoda používala atribut bgcolor změnit barvu pozadí tabulky. Lze jej také použít ke změně barvy řádku tabulky nebo buňky tabulky. Ale atribut bgcolor byl zastaralý ve prospěch stylů, takže to není optimální způsob, jak manipulovat s barvou pozadí tabulky.

Lepší způsob, jak změnit barvu pozadí, je přidat vlastnost stylu barva pozadí na značku tabulky, řádku nebo buňky.

Tento příklad změní barvu pozadí celé tabulky:

Chcete-li změnit barvu jednoho řádku, vložte vlastnost barva pozadí do.

Barvu jedné buňky můžete změnit přidáním atributu do.

Můžete také použít barvy pozadí na hlavy tabulek nebo

Změňte barvu pozadí pomocí šablon stylů

Je však lepší nepoužívat atribut background-color ve prospěch správně formátované šablony stylů. Můžete například nastavit styly v šabloně stylů v HLAVĚ dokumentu HTML nebo je nastavit v

externí styl. Změny, jako jsou tyto v HLAVĚ nebo v externí šabloně stylů, se u tabulek, řádků a buněk mohou zobrazit takto:

tabulka {barva pozadí: # ff0000; }
tr {barva pozadí: žlutá; }
td {barva pozadí: # 000; }

Nastavení barvy pozadí sloupce

Nejlepší způsob, jak nastavit barvu pozadí sloupce, je vytvořit a stylová třída a poté jej přiřadit buňkám sloupce. Vytvoření třídy vám umožní přiřadit danou třídu k buňkám v konkrétním sloupci pomocí jednoho atributu.

CSS:

td. ColColor {barva pozadí: modrá; }

HTML:

buňka 1 buňka 2 buňka 1 buňka 2

Jednou významnou výhodou ovládání barev pozadí pomocí šablony stylů je, že můžete později změnit výběr barev. Spíše než procházet dokumentem HTML a provádět změny v každé buňce, můžete provést jednu změnu volby barev v CSS který bude okamžitě použit na každou instanci, kde class = "ColColor" zobrazí se syntaxe.