Tabele niesymetryczne


Tabele niesymetryczne

Dotychczas opisywane tabele były symetryczne i zawsze zawierały tyle samo komórek w każdym wierszu. Teraz przyszła pora, by zająć się tworzeniem tabel o nieregularnych kształtach — niesymetrycznych. Zacznę od przykładu tabeli niesymetrycznej, byś dokładnie wiedział, o czym piszę. Przykład takiej tabeli znajduje się na rysunku.

tmpc3d7-1Zwróć uwagę na to, że w przypadku pierwszej tabeli drugi wiersz zawiera jedną komórkę, która została rozciągnięta na dwie kolumny. Nieco inaczej wygląda druga tabela, gdzie w pierwszej kolumnie rozciągnąłem komórkę na dwa wiersze.

Przedstawione działanie na tabelach jest możliwe dzięki dwóm atrybutom języka XHTML/HTML, używanym w znaczniku <td>. Mam tutaj na myśli rowspan i colspan. Pierwszy z nich rozciąga komórkę na sąsiednie wiersze, natomiast drugi na kolumny. Poniżej zamieszczam przykładowy listing dla tabel z rysunku.

<body>
<!– Tabela A.—>
<table border=“1″ width=“200” height=”200″>
<tr>
<td>1</td>
<td>2</td>
</tr>
<tr>
<td colspan=”2″>3</td>
</tr>
</table>
</body>

<body>
<!— Tabela A.–>
<table border=”1″ width=”200″ height=”200″>
<tr>
<td rowspan=,”2″>1</td>
<td>2</td>
</tr>
<tr>
<td>3</td>
</tr>
</table>
</body>

Zwróć uwagę, że przy atrybutach rowspan i colspan występuje wartość liczbowa, która określa, na ile wierszy lub kolumn ma zostać rozciągnięta formatowana komórka.

Oczywiście tabele mogą przybierać różne wymyślne kształty, a wszystko zależy od pomysłowości oraz znajomości znaczników języka XHTML/HTML. Pamiętaj, że do tworzenia tabel nie potrzeba Ci już niczego więcej.

Dodaj komentarz

Twój adres email nie zostanie opublikowany. Pola, których wypełnienie jest wymagane, są oznaczone symbolem *