Esistono diversi modi per rappresentare dati e informazioni, come grafici, grafici, pittogrammi o forme tabulari. La tabella organizza i dati in righe e colonne, rendendo i dati più leggibili e chiari. I dati tabulati consentono anche di risparmiare tempo e spazio. Per creare tabelle in HTML, usiamo
tagga con
etichetta,
tag per l'intestazione e
Per i dati della tabella.
I risultati di apprendimento di questo articolo saranno:
Cos'è HTML
Etichetta?
Come creare una tabella in HTML?
Quali sono gli attributi di
Etichetta?
Come creare tabella di intestazione verticale?
Cos'è HTML
Etichetta?
L'HTML
tag specifica una riga in una tabella, il
Il tag viene utilizzato per l'intestazione di tavolo e
Il tag è per i dati della tabella.
Sintassi
..
Il tag HTML TR ha un tag iniziale
e un tag di chiusura
.
Come creare una tabella in HTML?
L'esempio seguente dimostrerà come possiamo creare una tabella in HTML. Per farlo, prima, aggiungi un file
Tag e quindi specificare una didascalia usando il tag:
Informazioni sugli studenti
All'interno dell'elemento della tabella, aggiungi
Tag dopo la didascalia. La prima riga conterrà l'intestazione di ogni colonna. Per questo
Vengono utilizzati tag:
Rotolare n
Nome dello studente
Dob
Dopo aver creato tre colonne, aggiungiamo dati alle colonne. I dati verranno aggiunti a ciascuna riga in corrispondenza alle intestazioni nella riga successiva. Quindi, per aggiungere dati, il
Il tag è utilizzato:
1
John
23-05-1997
Allo stesso modo, crea altre due righe come mostrato nello snippet di codice di seguito:
2
William
02-9-1995
3
Margherita
12-03-1998
L'output corrispondente del codice sopra menzionato sarà così:
Applicare stili al tavolo con CSS
In questa sezione, applicheremo alcune proprietà di stile alla tabella che abbiamo creato sopra.
"margine"Proprietà con valore"auto"Posiziona il tavolo nella spaziatura centrale uguale da ciascun lato.
"larghezza"La proprietà viene utilizzata per impostare la larghezza della tabella.
"altezza"La proprietà imposta l'altezza del tavolo.
Produzione
Quali sono gli attributi di
Etichetta?
Ci sono molti attributi associati all'HTML
tag, come:
Rowspan
Colspan
Attributo: Rowspan
Questo attributo contiene un valore non negativo che specifica il numero di righe che la cella estende. Il suo valore predefinito è 1.
Esempio: come aggiungere l'attributo Rowspan a una riga della tabella? Quindi, dall'esempio sopra, abbiamo preso la seconda riga. Aggiungi l'Attributo RowsPan con il valore 2 ai dati della terza tabella:
2
William
02-9-1995
Si può vedere dall'immagine seguente, i terzi dati della seconda riga hanno preso spazio di due righe:
Attributo: Colspan
Questo attributo contiene un valore non negativo che specifica il numero di colonne che la cella estende. Il valore predefinito del Colspan è 1. Maggiore di 1000 valori verranno impostati come predefiniti perché sono considerati errati.
Esempio: come aggiungere l'attributo Colspan alla riga della tabella? Nel file HTML, il
Il tag viene aggiunto sotto il tag ed è fornito con l'attributo Colspan con un valore di 3:
Scuola Linuxhint
Dall'immagine seguente, si può vedere che l'intestazione del tavolo ha preso spazio per tre colonne:
Come creare tabella di intestazione verticale?
In HTML, aggiungi tre
tag. All'interno ciascuno, vengono posizionati altri tag, come
, Poi
tag. In tal modo, è possibile creare un tavolo con titoli verticali:
Nome
Tom
Andrea
Città
stati Uniti
Cina
Professione
Istruttore
Medico
Salva il file HTML e apri il file in un browser Web:
Si può osservare che l'intestazione della tabella è posizionata verticalmente.
Conclusione
Per creare una tabella per la nostra applicazione Web, HTML ci fornisce tag diversi per tabelle, righe e colonne come
,
, E
, rispettivamente. Quindi, questo blog ha spiegato l'HTML
Tag, il suo attributo e il metodo per creare una tabella di intestazione semplice e verticale.