Lezione 8 - Corso Intermedio Html

Come Raggruppare le Righe nelle Tabelle con Html


Raggruppare le Righe in una Tabella

Abbiamo visto come con colspan è possibile ragruppare le colonne. Ora con rowspan vediamo come è possible raggruppare le righe.

Sintassi:
< td colspan="numero di righe che la cella deve riempire">

Vediamo subito il codce:
<html>                      
 <head>			    
  <title>Tabelle - Raggruppare le Righe</title>     
 </head>
 <body>			    
    <h1>Tabelle - Raggruppare le Righe</h1>  
    <table border="1">
 	<tr>
  	  <th>Colonna 1</th> <th>Colonna 2</th>
 	<tr>
          <td rowspan="2">uno</td><td>due</td>
        </tr>
        <tr>
          <td>quattro</td>
        </tr>
        <tr>
          <td>cinque</td><td>sei</td>
        </tr>
</table>
</body>                
</html>                    

Se dal codice togliamo la cella tre, la cella quattro andrebbe ad occupare il posto vuoto lasciato dalla cella tre e a sua volta lascerebbe il suo posto vuoto, come vediamo quì sotto.

Colonna 1 Colonna 2
unodue
quattro
cinquesei

Ora noi vogliamo, per una migliore visibilità della tabella, che la cella uno, anziché la cella quattro, vada ad occupare lo spazio lasciato vuoto dalla cella tre che abbiamo tolto. Per tale scopo ci viene in aiuto l'attributo rowspan. Assegnamo l'attributo rowspan="2" alla cella uno questa occuperà anche lo spazio che occuperebbe la cella tre come vidiamo sotto.

Sullo schermo la tabella apparirebbe così:

Colonna 1 Colonna 2
unodue
quattro
cinquesei