02_html_tabele.pdf

(94 KB) Pobierz
Microsoft Word - 02_html_tabele.doc
Kurs WIT
Wyższa Szkoła Informatyki Stosowanej i Zarządzania WIT
Tabele w HTML
Jak HTML "widzi" tabelę:
Tabela w HTML to zbiór uporządkowanych komórek.
<table>
<table> - znacznik tabeli
<tr>
<tr> - znacznik wiersza tabeli
<td> Komórka 1 </td>
<td>- znacznik komórki tabeli
<td> Komórka 2 </td>
</tr>
<tr>
<td> Komórka 3 </td>
<td> Komórka 4 </td>
</tr>
</table>
<table>
<td>
K1
</td>
<td>
<tr>
K2
</tr>
</td>
<td>
K3
</td>
<td>
<tr>
K4
</tr>
</td>
</table>
Paweł Zawadzki (p.zawadzki@wit.edu.pl)
1
658764938.002.png
Kurs WIT
Wyższa Szkoła Informatyki Stosowanej i Zarządzania WIT
Atrybuty tabeli
Obramowanie
<table border ="szerokość obramowania" >
- szerokość obramowania, określana w pikselach
<table border ="1" >
Wyrównanie poziome
<table align ="left/right/center" >
- wyrównanie tabeli względem elementu nadrzędnego
<table align ="center" >
Szerokość
<table width ="%/piksele" >
- szerokość tabeli ustawiamy w pikselach lub procentach
<table width ="760" >
<table width ="100%" >
Odstępy pomiędzy komórkami
<table cellspacing=" wielkość odstępu >
- wielkość odstępu wyrażamy w pikselach
- 0 oznacza brak przestrzeni pomiędzy komórkami tabeli
<table cellspacing="0" >
Wewnętrzny margines komórek
<table cellpadding=" wielkość odstępu >
- wielkość odstępu wyrażamy w pikselach
- 0 oznacza brak marginesu
<table cellpadding="10" >
Paweł Zawadzki (p.zawadzki@wit.edu.pl)
2
658764938.003.png
Kurs WIT
Wyższa Szkoła Informatyki Stosowanej i Zarządzania WIT
Atrybuty wiersza tabeli
Wyrównanie zawartości komórek*
<tr align ="left/right/center" >
- wyrównanie poziome
<tr valign ="top/bottom/middle" >
- wyrównanie pionowe
*Atrybuty na poziomie wiersza dotyczą wszystkich komórek w obrębie <tr>
<tr align ="center" >
<tr valign ="middle" >
Atrybuty komórki tabeli
Wyrównanie zawartości komórki
<td align ="left/right/center" >
- wyrównanie poziome
<td valign ="top/bottom/middle" >
- wyrównanie pionowe
<td align ="center" >
<td valign ="middle" >
Szerokość
<td width ="%/piksele" >
- szerokość komórki ustawiamy w pikselach lub procentach
<td width ="100" >
<td width ="10%" >
Wysokość
<td height ="%/piksele" >
- szerokość komórki ustawiamy w pikselach lub procentach
<td height ="100" >
<td height ="10%" >
Paweł Zawadzki (p.zawadzki@wit.edu.pl)
3
658764938.004.png
Kurs WIT
Wyższa Szkoła Informatyki Stosowanej i Zarządzania WIT
Scalanie komórek
<td colspan ="liczba komórek" >
"
colspan="2"
- scalanie kolumanch
<td rowspan ="liczba komórek" >
- scalanie w wierszach
<td colspan ="2" >
<td rowspan ="3" >
Paweł Zawadzki (p.zawadzki@wit.edu.pl)
4
658764938.005.png
Kurs WIT
Wyższa Szkoła Informatyki Stosowanej i Zarządzania WIT
Zagnieżdżanie tabel
Co to jest zagnieżdżanie tabel ?
T2 K1
T2 K2
T1 K2
T2 K3
T2 K4
T1 K3
T1 K4
Umieszczanie tabeli wewnątrz komórki innej tabeli.
<table>
<tr>
<td>
<table>
<tr>
<td> T2 K1 </td>
<td> T2 K2 </td>
</tr>
<tr>
<td> T2 K3 </td>
<td> T2 K4 </td>
</tr>
</table>
</td>
<td> T1 K2 </td>
</tr>
<tr>
<td> T1 K3 </td>
<td> T1 K4 </td>
</tr>
</table>
Paweł Zawadzki (p.zawadzki@wit.edu.pl)
5
658764938.001.png

Plik z chomika:

Inne pliki z tego folderu:

Inne foldery tego chomika:

Zgłoś jeśli naruszono regulamin