Lezione 7 - Corso Intermedio Html

Come Raggruppare le Colonne nelle Tabelle con Html


Raggruppare le Colonne in una Tabella

Se ad una cella di una riga di una tabella vogliamo raggruppare una o più colonne, usiamo l'attributo colspan.
L'attributo colspan viene applicato ad una cella in modo che occupi più di una colonna e rendere tutta la tabella più ordinata.

Sintassi:
< th o td colspan="numero di celle che la cella deve riempire">

Passiamo al codice e vediamolo in pratica:
<html>                      
 <head>			    
  <title>Raggruppare le Colonne</title>     
 </head>
 <body>			    
    <h1>Raggruppare le Colonne di una Tabella</h1>  
    <table border="1">
 	<tr>
  	<th colspan="3">Colonna 1</th>
 	</tr>
 	<tr>
  	<td>uno</td><td colspan="2">due</td>
 	</tr>
 	<tr>  	<td>tre</td><td>quattro</td><td>Cella</td>
 	</tr>
 	<tr>
  	<td>cinque</td><td colspan="2">sei</td>
 	</tr>
    </table>
 </body>                
</html>                    


Sullo schermo la tabella apparirebbe così:

Colonna 1
unodue
trequattroCella
cinquesei

Si vede subito che la cella Colonna 1 con l'attributo colspan="3" occupa tutte e tre le colonne, mentre la cella due con colspan="2" occupa 2 colonne, e la cella sei, anch'essa occupa 2 colonne avendo dato all'attributo colspan="2" il valore 2.