TABELLA IN HTML

Lorem ipsum dolor sit amet consectetur adipiscing

LE TABELLE

Lorem ipsum dolor sit amet consectetur adipiscing

COSA SONO?

I browser trattano gli elementi th e td in maniera differente: di solito il contenuto di una cella th viene visualizzato grassetto e centrato, mentre gli elementi td vengono allineati a sinistra.

Le tabelle rappresentano un metodo molto flessibile per ordinare gli oggetti secondo una griglia, fornendo una certa coesione visiva a una pagina Web.

20%

HTML

99%

BIFULCO GIUSYSAVARESE DEVA

Lorem ipsum dolor sit amet consectetur adipiscing

Vediamo ora gli attributi di <table>

Lorem ipsum dolor sit amet consectetur adipiscing

align: specifica l'allineamento orizzontale della tabella rispetto allo schermo (non quello del contenuto della tabella). I valori possibili sono:

• left: allineamento al margine sinistro dello schermo (valorepreimpostato); • right: allineamento al margine destro; • center: allineamento al centro dello schermo.

Lorem ipsum dolor sit amet consectetur adipiscing

Border

Lorem ipsum dolor sit amet consectetur adipiscing

border: fa sì che il browser visualizzi un bordo attorno alle celle della tabella (in sua assenza la tabella non ha alcuna griglia attorno ai dati contenuti). Si può impostare lo spessore del bordo fornendo a questo attributo un valore intero. Per esempio: border="3" crea un bordo largo tre pixel intorno alle celle.

Lorem ipsum dolor sit amet consectetur adipiscing

Lorem ipsum dolor sit amet consectetur adipiscing

cellpadding: consente di specificare il numero di pixel di cui vanno separate le celle della tabella; cellspacing: consente di specificare il numero di pixel che si vogliono come contorno dei dati in ciascuna cella; width: specifica la larghezza della tabella: se viene indicato in % rappresenta la percentuale di larghezza della tabella rispetto allo schermo, altrimenti il numero di pixel (questa possibilità è sconsigliata, in quanto non si conosce la larghezza della finestra dei browser che verranno utilizzati dall'utente).

Lorem ipsum dolor sit amet consectetur adipiscing

Lorem ipsum dolor sit amet consectetur adipiscing

GRAZIE PER L'ATTENZIONE!

BIFULCO GIUSYSAVARESE DEVA

Got an idea?

Use this space to add awesome interactivity. Include text, images, videos, tables, PDFs... even interactive questions! Premium tip: Get information on how your audience interacts with your creation:

• Visit the Analytics settings;
• Activate user tracking;
• Let the communication flow!

Got an idea?

Use this space to add awesome interactivity. Include text, images, videos, tables, PDFs... even interactive questions! Premium tip: Get information on how your audience interacts with your creation:

• Visit the Analytics settings;
• Activate user tracking;
• Let the communication flow!

Got an idea?

Use this space to add awesome interactivity. Include text, images, videos, tables, PDFs... even interactive questions! Premium tip: Get information on how your audience interacts with your creation:

• Visit the Analytics settings;
• Activate user tracking;
• Let the communication flow!

Got an idea?

Use this space to add awesome interactivity. Include text, images, videos, tables, PDFs... even interactive questions! Premium tip: Get information on how your audience interacts with your creation:

• Visit the Analytics settings;
• Activate user tracking;
• Let the communication flow!

Got an idea?

Use this space to add awesome interactivity. Include text, images, videos, tables, PDFs... even interactive questions! Premium tip: Get information on how your audience interacts with your creation:

• Visit the Analytics settings;
• Activate user tracking;
• Let the communication flow!

Una tabella viene definita dalla coppia di tag <table> </table>, al cui interno si inseriscono i tag: • <tr> </tr> identifica le righe; • <th> </th> identifica una cella che funge da intestazione; • <td> </td> identifica una cella contenente i dati.