Esercitazione HTML

HTML HOME Introduzione all'HTML Editor HTML HTML di base Elementi HTML Attributi HTML Intestazioni HTML Paragrafi HTML Stili HTML Formattazione HTML Citazioni HTML Commenti HTML Colori HTML CSS HTML Collegamenti HTML Immagini HTML Favicon HTML Tabelle HTML Elenchi HTML Blocco HTML e in linea Classi HTML ID HTML Iframe HTML JavaScript HTML Percorsi di file HTML Testa HTML Layout HTML HTML reattivo Codice informatico HTML Semantica HTML Guida allo stile HTML Entità HTML Simboli HTML Emoji HTML Set di caratteri HTML Codifica URL HTML HTML e XHTML

Moduli HTML

Moduli HTML Attributi del modulo HTML Elementi del modulo HTML Tipi di input HTML Attributi di input HTML Attributi del modulo di input HTML

Grafica HTML

Tela HTML HTML SVG

Supporto HTML

Supporto HTML Video HTML Audio HTML Plug-in HTML YouTube HTML

API HTML

Geolocalizzazione HTML Trascina/rilascia HTML Archiviazione Web HTML Lavoratori Web HTML HTML SSE

Esempi HTML

Esempi HTML Quiz HTML Esercizi HTML Certificato HTML Riepilogo HTML Accessibilità HTML

Riferimenti HTML

Elenco tag HTML Attributi HTML Attributi globali HTML Supporto browser HTML Eventi HTML Colori HTML Tela HTML Audio/video HTML Tipi di documenti HTML Set di caratteri HTML Codifica URL HTML Codici HTML Lang Messaggi HTTP Metodi HTTP Convertitore da PX a EM Tasti rapidi

Dimensioni tabella HTML


Le tabelle HTML possono avere dimensioni diverse per ogni colonna, riga o per l'intera tabella.


     
     
     
     
     
     
     
     

Utilizzare l' styleattributo con le proprietà widtho height per specificare la dimensione di una tabella, riga o colonna.


Larghezza tabella HTML

Per impostare la larghezza di una tabella, aggiungi l' style attributo <table>all'elemento:

Esempio

Imposta la larghezza della tabella al 100%:

<table style="width:100%">
  <tr>
    <th>Firstname</th>
    <th>Lastname</th>
    <th>Age</th>
  </tr>
  <tr>
    <td>Jill</td>
    <td>Smith</td>
    <td>50</td>
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td>
    <td>94</td>
  </tr>
</table>

Nota: l'utilizzo di una percentuale come unità di misura per una larghezza indica la larghezza dell'elemento rispetto al suo elemento padre, che in questo caso è l' <body> elemento.


Larghezza colonna tabella HTML

     
     
     

Per impostare la dimensione di una colonna specifica, aggiungi l' style attributo su un elemento <th>o :<td>

Esempio

Imposta la larghezza della prima colonna al 70%:

<table style="width:100%">
  <tr>
    <th style="width:70%">Firstname</th>
    <th>Lastname</th>
    <th>Age</th>
  </tr>
  <tr>
    <td>Jill</td>
    <td>Smith</td>
    <td>50</td>
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td>
    <td>94</td>
  </tr>
</table>


Altezza della riga della tabella HTML

     
     
     

Per impostare l'altezza di una riga specifica, aggiungi l' style attributo su un elemento riga della tabella:

Esempio

Imposta l'altezza della seconda riga su 200 pixel:

<table style="width:100%">
  <tr>
    <th>Firstname</th>
    <th>Lastname</th>
    <th>Age</th>
  </tr>
  <tr style="height:200px">
    <td>Jill</td>
    <td>Smith</td>
    <td>50</td>
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td>
    <td>94</td>
  </tr>
</table>

Esercizi HTML

Mettiti alla prova con gli esercizi

Esercizio:

Usa gli stili CSS per rendere la tabella larga 300 pixel.

<tabella >
  <tr>
    <th>Nome</th>
    <th>Cognome</th>
    <th>Punti</th>
  </tr>
  <tr>
    <td>Jill</td>
    <td>Smith< /td>
    <td>50</td>
  </tr>
</table>