L e k c e č. 4 - Tabulky
Postoupili jste do čtvrté - závěrečné lekce, ve které se seznámíme se zajímavou problematikou tabulek. Jde o velmi obsáhlé a vyčerpávající téma, proto jsme lekci rozdělil na 13 tematických celků a ty umístili na samostatné stránky. Přejeme Vám hodně zdaru a teď začínáme ... rozcestníkem:
- Co jsou a k čemu složí tabulky
- Základní tabulka
- Ohraničení tabulky
- Barevné ohraničení tabulky
- Pozadí tabulky, řádku a buňky
- Odsazení obsahu buňky od jejího ohraničení
- Odsazení mezi jednotlivými buňkami
- Zarovnání ve vodorovném směru
- Zarovnání ve svislém směru
- Nastavení šířky a výšky tabulky, řádku a buňky
- Nestandardní výška a šířka buňky
- Vnořování tabulek
- Složitější tabulky
5. Pozadí tabulky, řádku a buňky
Chceme-li změnit barvu pozadí celé tabulky (řádku, nebo jenom buňky) provedeme to pomocí atributu BGCOLOR. Tomu jako hodnotu přiřadíme buď název barvy, anebo její RGB zápis.
Tabulka se stříbrným pozadím:
<TABLE border="1" bgcolor="silver"> <TR> <TD>1.řádek, 1.buňka</TD> <TD>1.řádek, 2.buňka</TD>
</TR> <TR> <TD>2.řádek, 1.buňka</TD> <TD>2.řádek, 2.buňka</TD> </TR> </TABLE>
Výsledek zdrojového kódu:
1.řádek, 1.buňka | 1.řádek, 2.buňka | 2.řádek, 1.buňka | 2.řádek, 2.buňka |
|
Tabulka se stříbrným pozadím jedné buňky:
<TABLE border="1"> <TR> <TD bgcolor="silver">1.řádek, 1.buňka</TD> <TD>1.řádek, 2.buňka</TD>
</TR> <TR> <TD>2.řádek, 1.buňka</TD> <TD>2.řádek, 2.buňka</TD> </TR> </TABLE>
Výsledek zdrojového kódu:
1.řádek, 1.buňka | 1.řádek, 2.buňka | 2.řádek, 1.buňka | 2.řádek, 2.buňka |
|
Pokud chceme umístit na pozadí tabulky, řádku nebo jenom buňky nějaký obrázek potom musíme použít atribut BACKGROUND. Tomu jako hodnotu přiřadíme URL cestu (absolutní, nebo relativní) k onomu obrázku.
<TABLE border="1" background="../obrazky/pozadi.jpg"> <TR> <TD>1.řádek, 1.buňka</TD> <TD>1.řádek, 2.buňka</TD>
</TR> <TR> <TD>2.řádek, 1.buňka</TD> <TD>2.řádek, 2.buňka</TD> </TR> </TABLE>
Výsledek zdrojového kódu:
1.řádek, 1.buňka | 1.řádek, 2.buňka | 2.řádek, 1.buňka | 2.řádek, 2.buňka |
|
|