Collocate il punto di inserimento nella posizione in cui la tabella dovrà apparire nella pagina.
- Guida utente di Dreamweaver
- Introduzione
- Dreamweaver e Creative Cloud
- Aree di lavoro e viste di Dreamweaver
- Configurare i siti
- Siti di Dreamweaver
- Configurare una versione locale del sito
- Collegamento a un server di pubblicazione
- Configurare un server di prova
- Importare ed esportare le impostazioni di un sito Dreamweaver
- Passaggio di siti Web esistenti da un server remoto alla cartella principale del sito locale
- Funzioni di accessibilità in Dreamweaver
- Impostazioni avanzate
- Impostazione delle preferenze del sito per il trasferimento dei file
- Specificare le Impostazioni del server proxy in Dreamweaver
- Sincronizzare le impostazioni di Dreamweaver con Creative Cloud
- Utilizzo di Git in Dreamweaver
- Gestire i file
- Creare e aprire file
- Gestire file e cartelle
- Scaricamento e caricamento dei file da e verso il server
- Depositare e ritirare i file
- Sincronizzare i file
- Confrontare file per verificare le differenze
- Applicare la maschera file a file e cartelle del sito Dreamweaver
- Attivare le Design Notes per i siti di Dreamweaver
- Impedire un potenziale attacco exploit del Gatekeeper
- Layout e progettazione
- Usare i riferimenti visivi per il layout
- Informazioni sull'utilizzo di CSS per creare il layout della pagina
- Progettazione di siti Web reattivi con Bootstrap
- Creazione e utilizzo di media query in Dreamweaver
- Presentare il contenuto mediante le tabelle
- Colori
- Responsive design con i layout a griglia fluida
- Extract in Dreamweaver
- CSS
- Nozioni sui fogli di stile CSS
- Creazione del layout delle pagine con CSS Designer
- Utilizzare i preprocessori CSS in Dreamweaver
- Impostare le preferenze di stile CSS in Dreamweaver
- Spostare le regole CSS in Dreamweaver
- Convertire CSS in linea in una regola CSS in Dreamweaver
- Utilizzare i tag div
- Applicare sfumature allo sfondo
- Creare e modificare effetti di transizione CSS3 in Dreamweaver
- Formattazione del codice
- Contenuto e risorse delle pagine
- Impostare le proprietà di pagina
- Impostare le proprietà dei collegamenti CSS e le proprietà dei collegamenti CSS
- Lavorare con il testo
- Ricercare e sostituire testo, tag e attributi
- Pannello DOM
- Modifica nella vista Dal vivo
- Codifica dei documenti in Dreamweaver
- Selezionare e visualizzare gli elementi nella finestra del documento
- Definire le proprietà del testo nella finestra di ispezione Proprietà
- Eseguire il controllo ortografico di una pagina Web
- Utilizzo dei filetti orizzontali in Dreamweaver
- Aggiungere e modificare le combinazioni di caratteri in Dreamweaver
- Operazioni con le risorse
- Inserire e aggiornare le date in Dreamweaver
- Creare e gestire le risorse preferite in Dreamweaver
- Inserire e modificare le immagini in Dreamweaver
- Aggiungere oggetti multimediali
- Aggiunta di video in Dreamweaver
- Inserire video HTML5
- Inserire file SWF
- Aggiungere effetti audio
- Inserire l'audio HTML5 in Dreamweaver
- Operazioni con le voci di libreria
- Utilizzare testo in arabo e in ebraico in Dreamweaver
- Collegamenti e navigazione
- Widget ed effetti jQuery
- Programmazione dei siti Web
- Programmazione in Dreamweaver
- Ambiente di codifica in Dreamweaver
- Impostare le preferenze di codifica
- Personalizzare la colorazione del codice
- Scrivere e modificare codice
- Suggerimenti sul codice e completamento del codice
- Comprimere ed espandere codice
- Riutilizzo del codice con gli snippet
- Comando Lint
- Ottimizzare il codice
- Modificare il codice nella vista Progettazione.
- Utilizzo del contenuto dell'intestazione delle pagine
- Inserimento di server-side include in Dreamweaver
- Uso delle librerie di tag in Dreamweaver
- Importazione di tag personalizzati in Dreamweaver
- Utilizzare i comportamenti JavaScript (istruzioni generali)
- Applicare comportamenti JavaScript incorporati
- Informazioni su XML e XSLT
- Eseguire trasformazioni XSL server-side in Dreamweaver
- Esecuzione di trasformazioni XSL client-side in Dreamweaver
- Aggiungere entità di carattere per XSLT in Dreamweaver
- Formattazione del codice
- Flussi di lavoro di interazione con altri prodotti
- Installazione e uso delle estensioni in Dreamweaver
- Aggiornamenti in app in Dreamweaver
- Inserire documenti Microsoft Office in Dreamweaver (solo Windows)
- Operazioni con Fireworks e Dreamweaver
- Modificare il contenuto nei siti Dreamweaver mediante Contribute
- Integrazione tra Dreamweaver e Business Catalyst
- Creare campagne e-mail personalizzate
- Modelli
- Informazioni sui modelli di Dreamweaver
- Riconoscere i modelli e i documenti basati sui modelli
- Creare un modello di Dreamweaver
- Creare aree modificabili nei modelli
- Creare aree e tabelle ripetute nei modelli in Dreamweaver
- Usare le aree opzionali nei modelli
- Definire attributi di tag modificabili in Dreamweaver
- Creare modelli nidificati in Dreamweaver
- Modificare, aggiornare ed eliminare modelli
- Esportare e importare contenuti xml in Dreamweaver
- Applicare o rimuovere un modello da un documento esistente
- Modificare il contenuto nei modelli di Dreamweaver
- Regole di sintassi per i tag di modello in Dreamweaver
- Impostare le preferenze di evidenziazione per le aree dei modelli
- Vantaggi dell'uso dei modelli in Dreamweaver
- Dispositivi mobili e multischermo
- Siti, pagine e moduli Web dinamici
- Applicazioni Web
- Configurare il computer per lo sviluppo di applicazioni
- Risoluzione dei problemi relativi alle connessioni di database
- Rimozione di script di connessione in Dreamweaver
- Progettare pagine dinamiche
- Panoramica sulle origini di contenuto dinamico
- Definire le origini di contenuto dinamico
- Aggiungere contenuto dinamico alle pagine
- Modifica del contenuto dinamico in Dreamweaver
- Visualizzare i record di database
- Fornire dati dal vivo e risoluzione dei problemi in Dreamweaver
- Aggiungere comportamenti server personalizzati in Dreamweaver
- Creazione di moduli con Dreamweaver
- Usare moduli per raccogliere informazioni dagli utenti
- Creare e attivare i moduli ColdFusion in Dreamweaver
- Creare moduli Web
- Supporto HTML5 avanzato per gli elementi modulo
- Sviluppare un modulo con Dreamweaver
- Sviluppo visivo delle applicazioni
- Creare pagine principali e di dettaglio in Dreamweaver
- Creare pagine di ricerca e di risultati
- Creare una pagina di inserimento record
- Costruire una pagine di aggiornamento record in Dreamweaver
- Costruzione di pagine di eliminazione record in Dreamweaver
- Utilizzare comandi ASP per modificare un database in Dreamweaver
- Creare una pagina di registrazione
- Creare una pagina di login
- Creare una pagina accessibile solo agli utenti autorizzati
- Protezione delle cartelle in ColdFusion utilizzando Dreamweaver
- Utilizzo di componenti ColdFusion in Dreamweaver
- Verifica, anteprima e pubblicazione dei siti Web
- Risoluzione dei problemi
Utilizzare le tabelle per presentare i contenuti nel sito web. Inoltre, come dividere e unire le celle della tabella e importare ed esportare dati in formato tabulare.
Le tabelle sono uno strumento particolarmente utile per presentare dati e disporre testo e grafica in una pagina HTML. Una tabella è costituita da una o più righe contenenti una o più celle. Sebbene le colonne non vengano specificate in maniera esplicita nel codice HTML, Dreamweaver consente di modificare sia le colonne che le righe e le celle.
Dreamweaver visualizza la larghezza della tabella e della colonna per ogni colonna di tabella, quando la tabella viene selezionata o quando il punto di inserimento viene posizionato su di essa. Accanto alle larghezze si trovano le frecce per il menu dell'intestazione della tabella e per i menu dell'intestazione della colonna. I menu consentono di accedere rapidamente ai comandi più comuni relativi alle tabelle. Potete attivare o disattivare le larghezze e i menu.
Se la larghezza della tabella o di una colonna non è visualizzata, significa che per la tabella o la colonna non è stata specificata una larghezza nel codice HTML. Se sono visualizzati due numeri, significa che la larghezza visiva che appare nella vista Progettazione non corrisponde a quella specificata nel codice HTML. Ciò può avvenire quando ridimensionate una tabella trascinandone l'angolo inferiore destro o quando aggiungete contenuto a una cella di larghezza maggiore rispetto a quella impostata.
Ad esempio, se impostate la larghezza di una colonna su 200 pixel e successivamente aggiungete un contenuto la cui larghezza è di 250 pixel, vengono visualizzati due numeri per la colonna: 200 (larghezza specificata nel codice) e (250) tra parentesi (larghezza visiva della colonna visualizzata sullo schermo).
potete anche creare il layout delle pagine utilizzando il posizionamento CSS.
Precedenza per la formattazione delle tabelle in HTML
Quando formattate una tabella nella vista Progettazione, potete definire le proprietà dell'intera tabella o delle righe, colonne o celle selezionate nella tabella. Quando si imposta una proprietà, ad esempio il colore di sfondo o l'allineamento, su un valore per l'intera tabella e su un valore diverso per singole celle, la formattazione delle celle ha la precedenza sulla formattazione delle righe, che a sua volta ha la precedenza sulla formattazione della tabella.
L'ordine di precedenza per la formattazione delle tabelle è il seguente:
- Celle
- Righe
- Table
Ad esempio, se impostate il blu come colore di sfondo di una singola cella, quindi impostate il giallo come colore di sfondo dell'intera tabella, la cella blu non diventa gialla poiché la formattazione della cella ha la precedenza sulla formattazione della tabella.
quando impostate le proprietà in una colonna, Dreamweaver modifica gli attributi del tag td corrispondente a ciascuna cella della colonna.
Informazioni sulla divisione e sull'unione delle celle di tabella
Potete unire un numero qualsiasi di celle adiacenti (a condizione che la selezione abbia la forma di una linea o di un rettangolo) in modo da creare una singola cella che occupi più righe o colonne. Una cella, a sua volta, può essere divisa in un numero qualsiasi di righe o colonne, indipendentemente dal fatto che sia stata o meno unita in precedenza. La tabella viene ristrutturata automaticamente da Dreamweaver con l'aggiunta dei necessari attributi colspan o rowspan in modo da ottenere la disposizione specificata.
Nell'esempio seguente, le celle al centro delle prime due righe sono state unite in un'unica cella che occupa due righe.
Inserire una tabella e aggiungere contenuto
Utilizzate il pannello o il menu Inserisci per creare una nuova tabella. Successivamente, aggiungete testo e immagini alle celle di tabella con le stesse modalità con le quali vengono aggiunti all'esterno di una tabella.
-
Nota:
se il documento è vuoto, potete posizionare il punto di inserimento solo all'inizio del documento.
Selezionate Inserisci > Tabella.
Nella categoria HTML del pannello Inserisci, fate clic su Tabella.
-
Impostate gli attributi della finestra di dialogo Tabella e fate clic su OK per creare la tabella.
Righe
Determina il numero di righe della tabella.
Colonne
Determina il numero di colonne della tabella.
Larghezza tabella
Specifica la larghezza della tabella in pixel o sotto forma di percentuale rispetto alla larghezza della finestra del browser.
Spessore bordo
Specifica la larghezza in pixel dei bordi della tabella.
Spaziatura celle
Specifica la distanza in pixel tra le celle adiacenti della tabella.
Nota:Se non assegnate valori espliciti alle opzioni Margine celle e Spaziatura celle, la maggior parte dei browser visualizza la tabella come se le opzioni Spessore bordo e Margine celle fossero impostate su 1 e l'opzione Spaziatura celle su 2. Per far sì che i browser visualizzino la tabella senza bordi e senza spaziatura o margine delle celle, impostate Margine celle e Spaziatura celle su 0.
Margine celle
Specifica la distanza in pixel tra il contenuto e i bordi della cella.
Nessuno
Non attiva alcuna intestazione di colonna o di riga per la tabella.
A sinistra
Consente di utilizzare la prima colonna per contenere tutte le intestazioni della tabella, così da poter inserire un'intestazione per ogni riga della tabella.
Margine superiore
Consente di utilizzare la prima riga per contenere tutte le intestazioni della tabella, così da poter inserire un'intestazione per ogni colonna della tabella.
Entrambe
Consente di inserire nella tabella intestazioni sia di riga sia di colonna.
Nota:Si consiglia di utilizzare le intestazioni nel caso in cui i visitatori del sito Web facciano uso di uno screen reader. Gli screen reader leggono le intestazioni delle tabelle e consentono agli utenti di individuare immediatamente le informazioni contenute nelle tabelle.
Didascalia
Consente di inserire un titolo da visualizzare al di fuori della tabella.
Riepilogo
Fornisce una descrizione della tabella. Gli screen reader leggono il testo riassuntivo, che però non viene visualizzato nel browser dell'utente.
Importare ed esportare le tabelle
I dati di tabella creati in altre applicazioni (ad esempio Microsoft Excel) e salvati in un formato di testo delimitato (con voci separate da tabulazioni, virgole, due punti, punto e virgola o altri delimitatori) possono essere importati in Dreamweaver e formattati come tabella.
Potete inoltre esportare i dati di una tabella di Dreamweaver in un file di testo in cui il contenuto delle celle adiacenti è separato da un delimitatore. I delimitatori utilizzabili sono la virgola, i due punti, il punto e virgola o lo spazio. Quando esportate una tabella, viene esportata l'intera tabella. Non potete selezionare parti della tabella da esportare.
Se desiderate esportare una parte dei dati di una tabella, ad esempio le prime sei righe o colonne, copiate le celle contenenti i dati, incollarle all'esterno della tabella per creare una nuova tabella, quindi esportate la nuova tabella.
Importare dati di tabella
-
Selezionate File > Importa > Importa dati di tabella.
-
Specificate le opzioni relative ai dati della tabella e fate clic su OK.
File di dati
Il nome del file da importare. Fate clic sul pulsante Sfoglia per selezionare un file.
Delimitatore
Il delimitatore utilizzato nel file da importare.
Se selezionate Altro, viene visualizzata una casella di testo a destra del menu a comparsa. Inserite il delimitatore utilizzato nel file.
Nota:specificate il delimitatore utilizzato al momento del salvataggio del file di dati. In caso contrario, il file non verrà importato in modo corretto e non potrete formattare i dati sotto forma di tabella.
Larghezza tabella
La larghezza della tabella.
Selezionate Adatta ai dati per adattare la larghezza di ogni colonna alla stringa di testo più lunga presente nella colonna.
Selezionate Imposta a per specificare una larghezza di tabella fissa espressa in pixel o come percentuale della larghezza della finestra del browser.
Bordo
Specifica la larghezza in pixel dei bordi della tabella.
Margine celle
Il numero di pixel tra il contenuto e i bordi delle celle.
Spaziatura celle
Il numero di pixel tra celle adiacenti della tabella.
Nota:Se non assegnate valori espliciti alle opzioni Bordo, Margine celle e Spaziatura celle, la maggior parte dei browser visualizza la tabella come se le opzioni Bordo e Margine celle fossero impostate su 1 e l'opzione Spaziatura celle su 2. Per far sì che i browser visualizzino la tabella senza spaziatura o margine delle celle, impostate Margine celle e Spaziatura celle su 0. Per visualizzare i bordi delle celle e della tabella quando l'opzione Bordo è impostata su 0, selezionate Visualizza > Riferimenti visivi > Bordi delle tabelle.
Formatta riga superiore
Specifica il tipo di formattazione eventualmente applicato alla riga superiore della tabella. Selezionate una delle quattro opzioni di formattazione: Nessuna formattazione, Grassetto, Corsivo o Grassetto corsivo.
Esportare una tabella
-
Posizionate il punto di inserimento in una cella della tabella.
-
Selezionate File > Esporta > Tabella.
-
Specificate le seguenti opzioni:
Delimitatore
Specifica il carattere delimitatore da utilizzare per separare le voci nel file esportato.
Interruzioni di riga
Specifica il sistema operativo in cui verrà aperto il file esportato: Windows, Macintosh o UNIX. Il carattere che indica la fine di una riga di testo varia a seconda del sistema operativo.
-
Fate clic su Esporta.
-
Inserite un nome da assegnare al file e fate clic su Salva.
Selezionare gli elementi di una tabella
Potete selezionare un'intera tabella, riga o colonna in un'unica operazione, così come selezionare una o più celle singole.
Quando posizionate il puntatore su una tabella, una colonna o una cella, Dreamweaver evidenzia tutte le celle nella selezione per mostrare quali celle saranno selezionate. Ciò risulta utile in presenza di tabelle senza bordi, tabelle nidificate o celle che occupano più colonne o righe. Potete modificare il colore di evidenziazione nelle preferenze.
Se posizionate il puntatore sul bordo di una tabella e si tiene premuto il tasto Ctrl (Windows) o Comando (Macintosh), viene evidenziata l'intera struttura della tabella, ossia tutte le celle. Ciò si rivela utile quando desiderate visualizzare la struttura di una sola tabella in una serie di tabelle nidificate.
Selezionare un'intera tabella
Per selezionare una tabella, effettuate una delle seguenti operazioni:
- Fate clic sull'angolo superiore sinistro della tabella per selezionare la tabella.
- Fate clic in una cella della tabella, quindi selezionate il tag nel selettore di tag presente nell'angolo inferiore sinistro della finestra del documento.
- Fate clic in una cella della tabella, quindi fate clic sul menu dell'intestazione della tabella, infine selezionate Seleziona tabella. Vengono visualizzate le maniglie di selezione sul bordo inferiore e destro della tabella selezionata.
- Fate clic in una cella della tabella e selezionate Modifica > Tabella > Seleziona tabella.
Selezionare una o più righe o colonne
-
Posizionate il puntatore sul margine sinistro di una riga o sul margine superiore di una colonna.
-
Quando il puntatore assume la forma di una freccia di selezione, fate clic per selezionare una riga o una colonna oppure trascinate il mouse per selezionare più righe o colonne.
Selezionare una colonna singola
-
Fate clic nella colonna.
-
Fate clic sul menu dell'intestazione della colonna, quindi selezionate Seleziona colonna.
Selezionare una cella singola
-
Effettuate una delle operazioni seguenti:
- Fate clic nella cella, quindi selezionate il tag <td> nel selettore di tag presente nell'angolo inferiore sinistro della finestra del documento.
- Tenete premuto il tasto Ctrl (Windows) o Comando (Macintosh) e fate clic nella cella.
Selezionare una riga di celle o un blocco rettangolare di celle
Trascinate il mouse da una cella a un'altra.
Fate clic in una cella, fate clic tenendo premuto il tasto Ctrl (Windows) o Comando (Macintosh) nella stessa cella per selezionarla, quindi fate clic su un'altra cella tenendo premuto il tasto Maiusc.
Selezionare celle non adiacenti
Al clic del mouse, gli elementi già selezionati vengono eliminati dalla selezione, mentre tutti quelli non selezionati vengono aggiunti alla selezione corrente.
Modificare il colore di evidenziazione degli elementi di tabella
-
Selezionate Modifica > Preferenze (Windows) o Dreamweaver > Preferenze (Macintosh).
-
Selezionate Evidenziazione dall'elenco Categoria a sinistra, effettuate una delle operazioni seguenti e fate clic su OK.
Per modificare il colore di evidenziazione degli elementi della tabella, fate clic sulla casella del colore delle aree modificabili, quindi selezionate un colore di evidenziazione utilizzando l'apposito selettore oppure inserite il valore esadecimale del colore di evidenziazione desiderato nella casella di testo.
Per attivare o disattivare l'evidenziazione per gli elementi di tabella, selezionate o deselezionate l'opzione Mostra per mouseover.
Nota:queste opzioni influiscono su tutti gli oggetti che Dreamweaver evidenzia quando il puntatore viene spostato su di esse.
Impostare le proprietà della tabella
Potete modificare le tabelle utilizzando la finestra di ispezione Proprietà.
-
Selezionate una tabella.
-
Nella finestra di ispezione Proprietà (Finestra > Proprietà), modificate le proprietà nel modo desiderato.
ID tabella
L'ID della tabella.
Righe e Colonne
Il numero di righe e di colonne della tabella.
La
La larghezza della tabella in pixel o sotto forma di percentuale rispetto alla larghezza della finestra del browser.
Nota:in genere, non è necessario impostare l'altezza di una tabella.
MargCell
Il numero di pixel tra il contenuto e i bordi delle celle.
SpazCell
Il numero di pixel tra celle adiacenti della tabella.
Allinea
Specifica la posizione in cui viene visualizzata la tabella rispetto agli altri elementi dello stesso paragrafo, ad esempio il testo o le immagini.
A sinistra allinea la tabella a sinistra degli altri elementi in modo che il testo dello stesso paragrafo venga disposto intorno alla tabella a destra, A destra allinea la tabella a destra degli altri elementi con il testo intorno alla tabella a sinistra, mentre Al centro centra la tabella e dispone il testo sopra e/o sotto la tabella. Predefinito specifica l'allineamento predefinito del browser.
Nota:Se si specifica l'allineamento predefinito, accanto alla tabella non viene visualizzato altro contenuto. Per visualizzare una tabella accanto ad altro contenuto, utilizzate l'allineamento A sinistra o A destra.
Bordo
Specifica la larghezza in pixel dei bordi della tabella.
Nota:Se non assegnate dei valori espliciti alle opzioni Bordo, MargCell e SpazCell, la maggior parte dei browser visualizza la tabella come se il bordo e il margine celle fossero impostati su 1 e la spaziatura celle su 2. Per far sì che i browser visualizzino la tabella senza spaziatura o margine delle celle, impostate Bordo, MargCell e SpazCell su 0. Per visualizzare i bordi delle celle e della tabella quando l'opzione Bordo è impostata su 0, selezionate Visualizza > Riferimenti visivi > Bordi delle tabelle.
Classe
Imposta una classe CSS nella tabella.
Nota:potrebbe essere necessario espandere la finestra di ispezione Proprietà tabella per visualizzare le opzioni seguenti. Per espandere la finestra di ispezione Proprietà tabella, fate clic sulla freccia di espansione situata nell'angolo inferiore destro.
Annulla larghezza celle e Annulla altezze celle
e Annulla altezza celle consentono di eliminare dalla tabella tutti i valori di altezza delle righe o di larghezza delle colonne specificati.
Converti larghezza celle in pixel
e Converti altezze tabella in pixel consentono di convertire la larghezza o l'altezza di ciascuna colonna della tabella (e la larghezza dell'intera tabella) nella larghezza corrente espressa in pixel.
Converti larghezza celle in percentuali
e Converti altezze tabella in percentuali consentono di convertire la larghezza o l'altezza di ciascuna colonna della tabella (e la larghezza dell'intera tabella) nella larghezza corrente espressa come percentuale della larghezza della finestra del documento.
Se avete inserito un valore in una casella di testo, premete Tab o Invio (Windows) oppure Invio (Macintosh) per applicarlo.
Impostare le proprietà di celle, righe e colonne
Potete anche utilizzare la finestra di ispezione Proprietà per modificare le celle e le righe di una tabella.
-
Selezionate la colonna o la riga.
-
Nella finestra di ispezione Proprietà (Finestra > Proprietà), impostate le opzioni seguenti:
Orizz
Specifica l'allineamento orizzontale del contenuto di una cella, riga o colonna. Potete allineare il contenuto a sinistra, a destra o al centro delle celle oppure potete specificare l'allineamento predefinito del browser (generalmente, a sinistra per le celle normali e al centro per le celle delle intestazioni).
Vert
Specifica l'allineamento verticale del contenuto di una cella, riga o colonna. Il contenuto può essere allineato in alto, al centro, in basso o alla linea di base oppure in base all'impostazione predefinita del browser (generalmente, al centro).
Larg. e Alt.
La larghezza e l'altezza delle celle selezionate espresse in pixel o come percentuale della larghezza o dell'altezza dell'intera tabella. Per specificare una percentuale, inserite il simbolo di percentuale (%) dopo il valore. Lasciate vuoto il campo (impostazione predefinita) per fare in modo che venga automaticamente applicata la larghezza o l'altezza appropriata in base al contenuto della cella e alla larghezza e all'altezza delle altre colonne e righe.
Per impostazione predefinita, vengono applicate un'altezza di riga e una larghezza di colonna adatte all'immagine di larghezza maggiore o alla riga di testo di lunghezza maggiore contenuta nella colonna. È per questo motivo che una colonna talvolta diventa molto più larga delle altre quando viene riempita con un contenuto.
Nota:potete specificare l'altezza come percentuale dell'altezza totale della tabella, ma la riga potrebbe non essere visualizzata con l'altezza specificata nei browser.
Sf
Il colore di sfondo di una cella, colonna o riga, scelto mediante il selettore colore.
Unisci celle
Consente di combinare le celle, le righe o le colonne selezionate e creare un'unica cella. Potete unire solo le celle che formano un blocco rettangolare o lineare.
Dividi cella
Suddivide una cella creando due o più celle. Potete dividere una sola cella alla volta. Se sono selezionate più celle, il pulsante è disattivato.
No a capo
Impedisce il ritorno a capo mantenendo tutto il testo della cella su una riga singola. Se l'opzione è attivata, le celle si allargano in modo da contenere tutti i dati digitati o incollati in una cella. Normalmente, le celle si espandono orizzontalmente in modo da contenere la parola più lunga o l'immagine più larga della cella, quindi si espandono verticalmente per contenere il contenuto rimanente.
Intest
Formatta le celle selezionate come intestazioni di tabella. Per impostazione predefinita, il contenuto delle celle di intestazione di una tabella è in grassetto e centrato.
Nota:Le larghezze e le altezze possono essere espresse in pixel o percentuali e convertite tra queste due unità di misura.
Nota:quando impostate le proprietà in una colonna, Dreamweaver modifica gli attributi del tag td corrispondente a ciascuna cella della colonna. Tuttavia, quando impostate determinate proprietà per una riga, Dreamweaver cambia gli attributi del tag tr invece di cambiare quelli di ciascun tag td nella riga. Se desiderate applicare lo stesso formato a tutte le celle di una riga, è consigliabile applicare il formato al tag tr in modo da ottenere un codice HTML più chiaro e conciso.
-
Premete Tab o Invio per applicare il valore.
Formattare tabelle e celle
Potete cambiare l'aspetto delle tabelle impostando le proprietà della tabella e delle celle oppure applicando una formattazione predefinita. Prima di impostare le proprietà della tabella e delle celle, tenete presente che l'ordine di priorità per la formattazione è il seguente: celle, righe, tabelle.
Per formattare il testo all'interno di una cella di tabella, utilizzate le stesse procedure con cui si formatta un testo esterno alla tabella.
Modificare il formato di tabelle, righe, celle o colonne
-
Selezionate una tabella, cella, riga o colonna.
-
Nella finestra di ispezione Proprietà (Finestra > Proprietà), fate clic sulla freccia di espansione situata nell'angolo inferiore destro e modificate le proprietà nel modo desiderato.
-
Apportate le modifiche necessarie alle proprietà.
Per ulteriori informazioni sulle opzioni, fate clic sull'icona Aiuto nella finestra di ispezione Proprietà.
Nota:quando impostate le proprietà in una colonna, Dreamweaver modifica gli attributi del tag td corrispondente a ciascuna cella della colonna. Quando invece impostate alcune proprietà per una riga, Dreamweaver modifica gli attributi del tag tr anziché modificare gli attributi di ciascun tag td della riga. Se desiderate applicare lo stesso formato a tutte le celle di una riga, è consigliabile applicare il formato al tag tr in modo da ottenere un codice HTML più chiaro e conciso.
Aggiungere o modificare i valori di accessibilità di una tabella nella vista Codice
Per individuare velocemente i tag nel codice, fate clic nella tabella, quindi selezionate il tag <table> nel selettore di tag nella parte inferiore della finestra del documento.
Aggiungere o modificare i valori di accessibilità di una tabella nella vista Progettazione
- Per modificare la didascalia della tabella, evidenziatela e digitate una nuova didascalia.
Per modificare l'allineamento della didascalia, posizionate il punto di inserimento nella didascalia, fate clic con il pulsante destro del mouse (Windows) o fate clic tenendo premuto il tasto Ctrl (Macintosh), quindi selezionate Modifica codice tag.
Per modificare il sommario della tabella, fate clic con il pulsante destro del mouse (Windows) o fate clic tenendo premuto il tasto Ctrl (Macintosh), quindi selezionate Modifica codice tag.
Ridimensionamento di tabelle, colonne e righe
Ridimensionamento delle tabelle
Potete cambiare le dimensioni di un'intera tabella oppure di singole righe e colonne. Quando ridimensionate un'intera tabella, variano proporzionalmente le dimensioni di tutte le celle. Se per le celle di una tabella sono state specificate esplicitamente le larghezze e le altezze, il ridimensionamento della tabella cambia la dimensione visiva delle celle nella finestra del documento, ma non modifica le larghezze e le altezze delle celle specificate.
Potete ridimensionare una tabella trascinando una delle sue maniglie di selezione. Dreamweaver visualizza la larghezza della tabella con il menu dell'intestazione nella parte superiore o inferiore della tabella, quando la tabella è selezionata o il punto di inserimento si trova al suo interno.
Talvolta la larghezza delle colonne impostata nel codice HTML non corrisponde alla larghezza visualizzata sullo schermo. In tal caso, potete pareggiare le larghezze. Le larghezze delle tabelle e delle colonne e i menu delle intestazioni vengono visualizzati in Dreamweaver per agevolare la definizione del layout delle tabelle. Potete attivare e disattivare larghezze e menu in base alle vostre esigenze.
Ridimensionamento delle colonne e righe
Potete modificare la larghezza di una colonna o l'altezza di una riga nella finestra di ispezione Proprietà o trascinando i bordi della colonna o della riga. Se si verificano dei problemi durante il ridimensionamento, annullate la larghezza delle colonne o l'altezza delle righe e ricominciare.
potete inoltre modificare i valori di larghezza e altezza direttamente nel codice HTML utilizzando la vista Codice.
Dreamweaver visualizza le larghezze delle colonne con i menu delle intestazioni delle colonne nella parte superiore o inferiore delle colonne quando la tabella è selezionata o quando il punto di inserimento si trova al suo interno. Potete attivare o disattivare tali menu in base alle vostre esigenze.
Ridimensionare una tabella
Selezionate la tabella. Se quando selezionate la tabella siete nella vista Dal vivo, viene mostrato Visualizzazione elemento. Fate clic sull'icona del panino per accedere alla modalità di formattazione della tabella.
Per ridimensionare la tabella orizzontalmente, trascinate la maniglia di ridimensionamento situata sul lato destro.
Per ridimensionare la tabella verticalmente, trascinate la maniglia di ridimensionamento situata sul lato inferiore.
Per ridimensionare la tabella in entrambe le direzioni, trascinate la maniglia di selezione situata nell'angolo inferiore destro.
Per uscire dalla modalità di formattazione della tabella nella vista Dal vivo, premete Esc o fate clic fuori dalla tabella. Potete utilizzare le opzioni del menu Modifica > Tabella per modificare ulteriormente la tabella.
Nota: le opzioni disponibili nel menu Modifica > Tabella sono diverse se selezionate l'intera tabella o una singola cella. Nella vista Dal vivo, Visualizzazione elemento mostra "tabella" quando è selezionata l'intera tabella e "td" quando è selezionata una determinata cella. Per passare dalla modalità di formattazione della cella a quella della tabella, fate clic sul bordo della tabella.
Modificare la larghezza di una colonna lasciando inalterata la larghezza complessiva della tabella
-
Nella vista Progettazione, trascinate il bordo destro della colonna da modificare.
Poiché anche la larghezza della colonna adiacente viene modificata, le colonne soggette al ridimensionamento sono in realtà due. Le indicazioni visive mostrano come verranno regolate le colonne. La larghezza complessiva della tabella non cambia.
Nota:nelle tabelle la cui larghezza è basata sulla percentuale e non sui pixel, se trascinate il bordo destro dell'ultima colonna di destra, viene modificata la larghezza dell'intera tabella ingrandendo o riducendo proporzionalmente tutte le colonne.
Modificare la larghezza di una colonna lasciando inalterata la dimensione delle altre colonne
-
Nella vista Progettazione, tenete premuto il tasto Maiusc e trascinate il bordo della colonna.
La larghezza di una colonna cambia. Le indicazioni visive mostrano come vengono organizzate le colonne; la larghezza complessiva della tabella viene modificata per adattare la colonna soggetta al ridimensionamento.
Modificare visivamente l'altezza di una riga
Pareggiare la larghezza delle colonne specificata nel codice con la larghezza visualizzata
-
Fate clic in una cella.
-
Fate clic sul menu dell'intestazione della tabella, quindi selezionate Pareggia tutte le larghezze.
Dreamweaver reimposta la larghezza specificata nel codice in modo che corrisponda alla larghezza visiva.
Annullare tutte le larghezze e le altezze impostate in una tabella
-
Selezionate la tabella.
-
Effettuate una delle operazioni seguenti:
Selezionate Modifica > Tabella > Annulla larghezza celle oppure Modifica > Tabella > Annulla altezza celle.
Nella finestra di ispezione Proprietà (Finestra > Proprietà), fate clic sul pulsante Annulla altezza celle o Annulla larghezza celle .
Fate clic sul menu dell'intestazione della tabella, quindi selezionate Annulla tutte le altezze o Annulla tutte le larghezze.
Annullare la larghezza impostata di una colonna
Attivare o disattivare le larghezze e dei menu delle tabelle e delle colonne nella vista Progettazione
Selezionate Visualizza > Opzioni vista Progettazione > Riferimenti visivi > Larghezze tabelle.
Aggiungere ed eliminare righe e colonne
Per aggiungere ed eliminare righe e colonne, utilizzate Elabora > Tabella oppure i menu dell'intestazione delle colonne.
Se premete Tab nell'ultima cella, viene automaticamente aggiunta una riga alla tabella.
Aggiungere una singola riga o colonna
Selezionate Modifica > Tabella > Inserisci riga o Modifica > Tabella > Inserisci colonna.
Viene visualizzata una riga al di sopra del punto di inserimento o una colonna a sinistra del punto di inserimento.
Fate clic sul menu dell'intestazione della colonna, quindi selezionate Inserisci colonna a sinistra o Inserisci colonna a destra.
Aggiungere più righe o colonne
-
Fate clic in una cella.
-
Selezionate Modifica > Tabella > Inserisci righe o colonne, completate la finestra di dialogo e fate clic su OK.
Inserisci
Indica se devono essere inserite righe o colonne.
Numero di righe o Numero di colonne
Il numero di righe o colonne da inserire.
Posizione
Specifica se le nuove righe o colonne devono essere visualizzate sopra o sotto la riga o la colonna della cella selezionata.
Eliminare una riga o una colonna
Fate clic in una cella all'interno della riga o colonna che desiderate eliminare, quindi selezionate Modifica > Tabella > Elimina riga o Modifica > Tabella > Elimina colonna.
Selezionate un'intera riga o colonna, quindi premete Canc.
- Nella finestra di ispezione Proprietà (Finestra > Proprietà), effettuate una delle seguenti operazioni:
- Per aggiungere o eliminare delle righe, aumentare o ridurre il valore Righe.
- Per aggiungere o eliminare delle colonne, aumentare o ridurre il valore Colonne.
se vengono eliminate righe o colonne che contengono dati, in Dreamweaver non viene visualizzato alcun messaggio di avviso.
Dividere e unire le celle
Per dividere o unire tra loro delle celle, usate la finestra di ispezione Proprietà o le opzioni del sottomenu Modifica > Tabella.
Unire due o più celle di una tabella
-
Selezionate celle contigue e disposte in forma di rettangolo.
Nell'illustrazione seguente, la selezione è di forma rettangolare e consente l'unione delle celle.
Al contrario, la selezione dell'illustrazione seguente non è di forma rettangolare e quindi non potete unire le celle.
-
Effettuate una delle operazioni seguenti:
Selezionate Modifica > Tabella > Unisci celle.
Nella finestra di ispezione Proprietà HTML espansa (Finestra > Proprietà), fate clic su Unisci celle.
Nota:se il pulsante non è visualizzato, fate clic sulla freccia di espansione nell'angolo inferiore destro della finestra di ispezione Proprietà per visualizzare tutte le opzioni.
Tutti i dati contenuti nelle singole celle vengono spostati nella singola cella risultante dall'unione, alla quale vengono applicate le proprietà della prima cella selezionata.
Dividere una cella
-
Fate clic nella cella ed effettuate una delle seguenti operazioni:
Selezionate Modifica > Tabella > Dividi cella.
Nella finestra di ispezione Proprietà HTML espansa (Finestra > Proprietà), fate clic su Dividi cella.
Nota:se il pulsante non è visualizzato, fate clic sulla freccia di espansione nell'angolo inferiore destro della finestra di ispezione Proprietà per visualizzare tutte le opzioni.
-
Nella finestra di dialogo Dividi cella, specificate il tipo di divisione:
Dividi cella in
Consente di specificare se la cella deve essere divisa in righe o colonne.
Numero di righe/Numero di colonne
Consente di specificare il numero di righe o colonne in cui deve essere divisa la cella.
Aumentare o ridurre il numero di righe o colonne occupate da una cella
Selezionate Modifica > Tabella > Aumenta estensione riga o Modifica > Tabella > Aumenta estensione colonna.
Selezionate Modifica > Tabella > Riduci estensione riga o Modifica > Tabella > Riduci estensione colonna.
Copiare, incollare ed eliminare celle
Potete copiare, incollare o eliminare una o più celle contemporaneamente mantenendone la formattazione.
Le celle possono essere incollate in corrispondenza del punto di inserimento oppure al posto di una selezione all'interno di una tabella esistente. Per incollare più celle di tabella, il contenuto degli Appunti deve essere compatibile con la struttura della tabella o della selezione all'interno della tabella in cui desiderate incollare le celle.
Tagliare o copiare celle
-
Selezionate una o più celle contigue e disposte in forma di rettangolo.
Nell'illustrazione seguente, la selezione è di forma rettangolare e consente di tagliare o copiare le celle.
Al contrario, la selezione dell'illustrazione seguente non è di forma rettangolare e non è quindi possibile tagliare o copiare le celle.
-
Selezionate Modifica > Taglia o modifica > Copia.Nota:
se selezionate un'intera riga o colonna e selezionate Modifica > Taglia, viene eliminato dalla tabella non solo il contenuto delle celle, ma anche l'intera riga o colonna.
Incollare celle di tabella
-
Selezionate la destinazione delle celle.
Per sostituire delle celle esistenti con le celle da incollare, selezionate una serie di celle esistenti con lo stesso formato delle celle contenute negli Appunti. (Ad esempio, se copiate o incollate un blocco di celle 3 x 2, potete selezionare un altro blocco di celle 3 x 2 da sostituire.)
Per incollare un'intera riga di celle sopra una cella particolare, fate clic nella cella.
Per incollare un'intera colonna di celle a sinistra di una cella particolare, fate clic nella cella.
Nota:se gli Appunti non contengono un'intera riga o colonna di celle e fate clic in una cella per incollare le celle contenute negli Appunti, è possibile (a seconda della posizione all'interno della tabella) che la cella su cui avete fatto clic e le celle adiacenti vengano sostituite dalle celle incollate.
- Per creare una nuova tabella con le celle incollate, posizionate il punto di inserimento all'esterno della tabella.
-
Selezionate Modifica > Incolla.
Se incollate intere righe o colonne in una tabella esistente, queste vengono aggiunte alla tabella. Se incollate una singola cella, il contenuto della cella selezionata viene sostituito. Se l'operazione viene effettuata all'esterno di una tabella, le righe, colonne o celle vengono utilizzate per definire una nuova tabella.
Eliminare il contenuto di una o più celle senza alterarle
-
Selezionate una o più celle.Nota:
è importante che la selezione non consista completamente di intere righe o colonne.
-
Premere Canc.
Nota:se selezionate soltanto righe o colonne intere e selezionate Modifica > Cancella o premete Canc, vengono eliminate dalla tabella le righe o colonne intere e non solo il loro contenuto.
Eliminare righe o colonne contenenti celle unite
-
Selezionate la riga o la colonna.
-
Selezionate Modifica > Tabella > Elimina riga o Modifica > Tabella > Elimina colonna.
Nidificare tabelle
Una tabella nidificata è una tabella che si trova all'interno di una cella di un'altra tabella. Potete formattare una tabella nidificata come qualunque altra tabella, con l'unica limitazione che la tabella nidificata non deve superare la larghezza della cella che la contiene.
-
Fate clic in una cella della tabella esistente.
-
Selezionate Inserisci > Tabella, impostate le opzioni della finestra di dialogo e fate clic su OK.
Ordinare le tabelle
Potete ordinare le righe di una tabella in base al contenuto di un'unica colonna È anche possibile ordinare una tabella in modo più complesso utilizzando come criterio il contenuto di due colonne.
Non è possibile ordinare tabelle che contengono gli attributi colspan o rowspan, ossia tabelle che contengono celle unite.
-
Selezionate la tabella o fate clic in una cella.
-
Selezionate Modifica > Tabella > Ordina tabella, impostate le opzioni della finestra di dialogo e fate clic su OK.
Ordina per
Specifica i valori di colonna in base ai quali devono essere ordinate le righe della tabella.
Ordine
Specifica se deve essere applicato un ordine alfabetico o numerico e ascendente (dalla A alla Z, dal numero più basso al numero più alto) o discendente.
Se le colonne contengono numeri, selezionate Ordine numerico. Se selezionate l'ordine alfabetico per una colonna contenente numeri a una e due cifre, l'ordine non rispetterà la sequenza numerica (ad esempio, sarà 1, 10, 2, 20, 3, 30 anziché 1, 2, 3, 10, 20, 30).
Poi per/Ordine
Specifica l'ordine da applicare a un ordinamento secondario in base a un'altra colonna. Specificate la colonna per l'ordinamento secondario nel menu a comparsa Poi per, quindi il tipo di ordinamento nei menu Ordine.
Includi la prima riga nell'ordinamento
Specifica se la prima riga della tabella deve essere inclusa nell'ordinamento. Se invece la prima riga non deve essere spostata, non selezionate questa opzione.
Ordina righe intestazione
Specifica di ordinare tutte le righe della sezione thead della tabella in base agli stessi criteri specificati per le righe del corpo principale della tabella. (Le righe thead non vengono spostate dalla sezione thead e rimangono visualizzate nella parte superiore della tabella anche dopo l'ordinamento.) Per informazioni sul tag thead, vedete il pannello Riferimenti (selezionate Aiuto > Riferimenti).
Ordina righe piè di pagina
Specifica di ordinare tutte le righe della sezione tfoot della tabella in base agli stessi criteri specificati per le righe della tabella. (Le righe tfoot non vengono spostate dalla sezione tfoot e rimangono visualizzate nella parte inferiore della tabella anche dopo l'ordinamento.) Per informazioni sul tag tfoot, vedete il pannello Riferimenti (selezionate Aiuto > Riferimenti).
Mantieni invariati i colori di tutte le righe al termine dell'ordinamento
Specifica che gli attributi di riga della tabella, ad esempio il colore, devono rimanere associati allo stesso contenuto dopo l'ordinamento. Se alle righe della tabella è stata applicata l'alternanza di due colori, non selezionate questa opzione in modo che l'alternanza venga mantenuta nella tabella ordinata. Se gli attributi di riga sono specifici del contenuto di ciascuna riga, selezionate questa opzione in modo che tali attributi rimangano associati alle righe corrette nella tabella ordinata.