Proprietà CSS table-layout

Definizione e uso

La proprietà tableLayout viene utilizzata per visualizzare le regole dell'algoritmo di visualizzazione delle celle, delle righe e delle colonne della tabella.

Disposizione della tabella fissa:

La disposizione della tabella fissa rispetto alla disposizione della tabella automatica permette al browser di effettuare la disposizione della tabella più rapidamente.

Nella disposizione della tabella fissa, la disposizione orizzontale dipende solo dalla larghezza della tabella, dalla larghezza delle colonne, dalla larghezza dei bordi della tabella e dello spazio tra le celle, e non dal contenuto delle celle.

Utilizzando la disposizione della tabella fissa, l'agente utente può visualizzare la tabella dopo aver ricevuto la prima riga.

Disposizione automatica della tabella:

Nella disposizione automatica della tabella, la larghezza delle colonne è determinata dal contenuto più largo senza riga di piegatura delle celle delle colonne.

Questo algoritmo a volte è più lento, poiché deve accedere a tutto il contenuto della tabella prima di determinare la disposizione finale.

Spiegazione

Questa proprietà specifica l'algoritmo di layout utilizzato per completare la disposizione della tabella. L'algoritmo di layout fisso è più veloce ma meno flessibile, mentre l'algoritmo automatico è più lento ma riflette meglio la tabella tradizionale HTML.

Vedi anche:

Tutorial CSS:Tabella CSS

Manuale di riferimento HTML DOM:Proprietà tableLayout

Esempio

Impostare l'algoritmo di disposizione della tabella:

table
  {
  table-layout:fixed;
  }

Prova tu stesso

Sintassi CSS

table-layout: auto|fixed|initial|inherit;

Valore dell'attributo

Valore Descrizione
automatica Predefinito. La larghezza delle colonne è determinata dal contenuto delle celle.
fixed La larghezza delle colonne è determinata dalla larghezza della tabella e dalla larghezza delle colonne.
inherit Definisce che l'attributo table-layout dovrebbe essere ereditato dal elemento padre.

Dettagli tecnici

Valore predefinito: auto
Ereditarietà: sì
Versione: CSS2
Sintassi JavaScript: oggetto.style.tableLayout="fixed"

Più esempi

Impostare la disposizione della tabella
Questo esempio dimostra come impostare la disposizione della tabella.

Supporto del browser

I numeri nella tabella indicano la versione del browser iniziale che supporta completamente questa proprietà.

Chrome IE / Edge Firefox Safari Opera
14.0 5.0 1.0 1.0 7.0