Wcześniej tworzyliśmy tabeli o takiej samej liczbie komórek w wierszu. Ale komórki można łączyć ze sobą. Robi się to za pomocą atrybutu colspan i rowspan. Colspan – łączy komórki poziomo, Rowspan – łączy komórki pionowo. Przykład tabeli gdzie komórki zostały połączone poziomo:
<table> <tr> <td colspan="3">3 komórki połączone <tr> <td>Jedna komórka <td>Jedna komórka <td>Jedna komórka </table> Przykład tabelki gdzie komórki zostały połączone pionowo <table> <tr> <td>Kolumna 1 <td colspan="3">Kolumna 2 <td>Kolumna 3 <tr> <td>Kolumna 1 <td>Kolumna 3 <tr> <td>Kolumna 1 <td>Kolumna 3 </table>
Oczywiście tabelki mogą być bardziej skomplikowane np.:
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Kod HTML do utworzenia powyższej tabelki
<table> <tr> <td rowspan="2">Komórka</td> <td>Komórka</td> <td colspan="2">Komórka</td> </tr> <tr> <td rowspan="2">Komórka</td> <td>Komórka</td> <td>Komórka</td> </tr> <tr> <td>Komórka</td> <td rowspan="2">Komórka</td> <td>Komórka</td> </tr> <tr> <td>Komórka</td> <td>Komórka</td> <td>Komórka</td> </tr> </table>