{"id":228633,"date":"2022-10-07T18:27:00","date_gmt":"2022-10-07T15:27:00","guid":{"rendered":"https:\/\/wordpress.mediadoma.com\/?p=228633"},"modified":"2022-11-09T03:24:35","modified_gmt":"2022-11-09T00:24:35","slug":"come-unire-le-celle-in-html-e-wordpress","status":"publish","type":"post","link":"https:\/\/wordpress.mediadoma.com\/it\/come-unire-le-celle-in-html-e-wordpress\/","title":{"rendered":"Come unire le celle in HTML e WordPress"},"content":{"rendered":"\n

Una tabella di dati con molte celle una accanto all’altra pu\u00f2 sembrare stipata. Ad alcune persone non dispiace questo tipo di presentazione dei dati, mentre altri preferirebbero sapere come unire le celle in HTML.<\/p>\n

Unendo le celle in una tabella, \u00e8 possibile presentare molti dati in una cella grande. Questo processo spesso comporta la visualizzazione di una cella di grandi dimensioni orizzontalmente, verticalmente o entrambi su molte righe o colonne.<\/p>\n

Quando le celle di una tabella si estendono su pi\u00f9 righe, si parla di "estensione delle righe". Quando le celle di una tabella si estendono su pi\u00f9 colonne, si parla di "estensione delle colonne" o "colspan".<\/p>\n

Questo \u00e8 principalmente a scopo di presentazione o reporting per rendere visivamente accattivante un foglio di calcolo. Questo articolo illustra come unire le celle in HTML e nell’ambiente di lavoro di WordPress.<\/p>\n

Come unire le celle di una tabella in HTML<\/h2>\n

L’attributo colspan pu\u00f2 unire pi\u00f9 celle di tabella in una colonna in un<\/p>\n

Tag HTML (dati tabella). Quando si uniscono pi\u00f9 celle di riga, \u00e8 possibile utilizzare l’attributo rowspan. Entrambi questi attributi saranno nel<\/p>\n

etichetta.<\/p>\n

Gli esempi seguenti mostrano come utilizzare questi attributi in HTML e come vengono visualizzati nel browser.<\/p>\n

Come utilizzare l’attributo Rowspan<\/h3>\n

Questo attributo determina quante righe una cella unita deve estendersi verticalmente. Pu\u00f2 creare una grande cella verticale<\/strong> da due o pi\u00f9 celle che occupano la stessa colonna, quindi visualizzarla in pi\u00f9 righe.<\/p>\n

Ad esempio, il codice<\/p>\n

unisce due celle per creare una grande cella posizionata verticalmente.<\/p>\n

Un esempio di codice tabella HTML che utilizza l’attributo Rowspan<\/p>\n

Il codice seguente deriva da una tabella con tre colonne e tre righe. Si pu\u00f2 usare l’attributo rowspan="2\u2033 nel primo<\/p>\n

tag per creare una singola cella dalle prime due celle della prima colonna.<\/p>\n

Il numero nell’attributo rowspan determina il numero di celle utilizzate per il<\/p>\n

etichetta.<\/p>\n

Quello che segue \u00e8 un esempio di codice di tabella HTML con una cella che si estende su due righe. Per capire meglio come funziona questo codice, sentiti libero di creare un rendering visivo in un browser.<\/p>\n

<table>\n<\/code><\/pre>\n
\"Come<\/a><\/p>\n
Il rendering di questo codice in un browser creer\u00e0 una tabella con una cella grande che copre l’altezza di due righe. La modifica del valore di estensione righe su 3 far\u00e0 s\u00ec che la prima cella si estenda all’altezza di tutte e tre le righe.<\/p>\n
\"Come<\/a><\/p>\n
Quando si espande a<\/p>\n
riga assicurati di eliminare<\/p>\n
tag dalle altre righe della tabella (<\/p>\n
). Quando la prima cella si estende su tutte e tre le righe, ce ne sono solo due<\/p>\n
tag negli altri due<\/p>\n
tag.<\/p>\n
Come utilizzare l’attributo Colspan<\/h3>\n
Questo attributo determina quante colonne una cella unita si estender\u00e0 orizzontalmente<\/strong>. Crea una grande cella orizzontale da due o pi\u00f9 celle che occupano la stessa riga, quindi la posiziona su pi\u00f9 colonne.<\/p>\n
In sostanza, l’attributo colspan definisce il numero di colonne visualizzate su una riga di grandi dimensioni. Ad esempio, il codice HTML<\/p>\n
unir\u00e0 due celle e creer\u00e0 una grande cella orizzontale.<\/p>\n
Due esempi di codice tabella HTML che utilizzano l’attributo Colspan<\/p>\n
Il codice seguente \u00e8 una tabella HTML con una cella grande che si estende su due colonne. Per capire meglio come funziona questo codice, sentiti libero di creare un rendering visivo in un browser.<\/p>\n
<table>\n<\/code><\/pre>\n
Il rendering di questo codice in un browser creer\u00e0 una tabella con una cella grande che copre la larghezza di due colonne. La modifica del valore dell’attributo colspan su 3 far\u00e0 s\u00ec che la prima cella si estenda alla larghezza di tutte e tre le colonne.<\/p>\n
\"Come<\/a><\/p>\n
Quando tutte e 3 le colonne sono incrociate, dovrebbe essercene solo una<\/p>\n
nella riga della tabella (<\/p>\n
). Quindi, assicurati di rimuovere qualsiasi residuo<\/p>\n
tag durante l’espansione a<\/p>\n
colonna.<\/p>\n
\"Come<\/a><\/p>\n
Ecco un altro esempio di tabella HTML con una cella che si estende su due colonne. Per comprendere meglio il codice, crea un rendering visivo nel tuo browser tramite il blocco note del tuo computer.<\/p>\n
<table><\/code><\/pre>\n
Come utilizzare "0" (Zero) negli attributi Rowspan e Colspan<\/h3>\n
\"Come<\/a><\/p>\n
Se utilizzato in colspan e rowspan in un browser moderno, "0" rappresenta la maggior parte delle colonne o delle righe. Ad esempio, si pu\u00f2 usare rowspan="0\u2033 per estendere una riga alla fine di una tabella invece di conteggiare le righe della tabella.<\/p>\n
Quali sono le migliori tabelle in cui utilizzare zero? Il numero zero \u00e8 particolarmente adatto per le tabelle dinamiche. \u00c8 ideale anche per tabelle di grandi dimensioni con numeri di colonne e righe che cambiano frequentemente.<\/p>\n
Come unire le celle di una tabella in WordPress usando il plugin wpDataTables<\/h2>\n
\"Come<\/a><\/p>\n
Puoi utilizzare l’HTML per creare tabelle tramite la casella di testo o installare plug-in che forniscono opzioni per le tabelle nel campo di testo visivo. Queste opzioni funzionano facilmente per tabelle semplici ma diventano difficili quando si lavora con tabelle pi\u00f9 grandi.<\/p>\n
Il plugin di WordPress wpDataTables<\/a> \u00e8 perfetto per unire celle all’interno di tabelle pi\u00f9 grandi. \u00c8 ottimo anche per creare, personalizzare e modificare questi tipi di tabelle.<\/p>\n
L’unione di celle \u00e8 semplice con wpDataTables. Pu\u00f2 essere fatto utilizzando la modalit\u00e0 di gestione delle celle scaricando il plug-in e attivandolo. Anche senza esperienza con i plugin di WordPress, l’installazione di wpDataTables \u00e8 facile per chiunque.<\/p>\n
Usando il plugin wpDataTables<\/h3>\n
\"Come<\/a><\/p>\n
Quando crei una tabella, seleziona la prima opzione nell’elenco, quindi fai clic su "Avanti". Crea un nome per la tua tabella di dati e scegli il numero di righe e colonne che desideri. Fai clic su "Genera tabella" per visualizzare una nuova tabella vuota.<\/p>\n
\"Come<\/a><\/p>\n
\u00c8 possibile selezionare uno dei 17 formati di data per le colonne della data e per i selettori di data interattivi.<\/p>\n
\"Come<\/a><\/p>\n
Il plug-in wpDataTables dispone anche di skin integrate per personalizzare la grafica del front-end della tabella. Queste skin includono:<\/p>\n