Nel mondo moderno di oggi quasi tutto è online sia che si tratti di acquisto, vendita, gestione degli account, ecc. a causa della quale è necessario organizzare un'enorme quantità di dati. Ma qui la domanda è come organizziamo quell'enorme quantità di dati? Quindi la risposta a questo problema è molto semplice, possiamo organizzare dati con l'aiuto delle tabelle. In HTML, le tabelle svolgono un ruolo vitale nell'organizzazione dei dati che migliora l'interattività dell'interfaccia.
Questo articolo ti guida a creare la tabella in HTML e serve i seguenti risultati: Questo articolo lo dirà
Come creare una tabella in HTML
Intestazione da tavolo
Table Cellspacing e cellpadding
Tabella Rowspan e Colspan
Didascalia
Intesta, corpo e piè di pagina per il tavolo
Come creare una tabella in HTML
Una tabella HTML viene utilizzata per organizzare i dati in righe e colonne. Per creare una tabella in HTML che utilizziamo
tagga e per creare righe in una tabella
il tag viene utilizzato mentre crea celle in una tabella che utilizziamo
etichetta. Il seguente esempio ti dà una chiara vista su come creare una tabella in HTML.
Esempio
TAVOLO
Burro
3 chilogrammi
Latte
3 litri
Nell'esempio sopra creiamo una tabella semplice con due righe e celle. Una tabella viene creata utilizzando
Tag insieme all'attributo del bordo. Quindi dentro a
tag che usiamo
Tag per creare la riga della tabella e all'interno
tag che usiamo
Tag per creare colonne all'interno di una riga.
Produzione
Come vedi, abbiamo preso un tavolo con due righe e colonne come previsto.
Intestazione da tavolo
Noi usiamo
Tag per inserire l'intestazione in un tavolo. Il seguente esempio lo spiega chiaramente
Esempio
TAVOLO
Prodotto
Quantità
Burro
3 chilogrammi
Latte
3 litri
In questo esempio abbiamo usato il
tag per dare intestazioni alla colonna.
Produzione
È così che aggiungiamo un'intestazione a un tavolo.
Table Cellspacing e cellpadding
Questi due attributi vengono utilizzati per la regolazione della spaziatura cellulare.
Cella: Questo attributo aggiunge spazi tra le cellule.
Cellpadding: Questo attributo specifica la distanza del contenuto cellulare dal bordo cellulare.
Questi attributi possono essere usati con
Tag solo. Il seguente esempio ti aiuta a capire meglio questi attributi.
Esempio 1
Prodotto
Quantità
Burro
3 chilogrammi
Latte
3 litri
In questo esempio utilizziamo l'attributo cellulare in
tagga e imposta il suo valore su 10 che aggiunge spazi tra le celle della tabella.
Produzione
L'output mostra chiaramente il risultato per la spaziatura cellulare che aggiunge spazi tra le cellule.
Esempio 2
Il seguente codice utilizza la cella di cella a una cella della tabella.
Prodotto
Quantità
Burro
3 chilogrammi
Latte
3 litri
In questo esempio utilizziamo l'attributo cellpadding in
tagga e imposta il suo valore su 10 che aggiunge spazi tra il contenuto di cellule e il bordo cellulare della tabella.
Produzione
Questo output mostra il risultato per cellpadding.
Tabella Rowspan e Colspan
Questi due attributi vengono usati per unire le righe e le colonne.
Rowspan: Due o più righe possono essere unite usando questo attributo.
Colspan: Due o più colonne possono essere unite usando questo attributo.
Questi attributi possono essere usati con
Tag solo. Il seguente esempio ti aiuta a capire meglio questi attributi.
Esempio
Prodotto
Sapori
Latte
Mandorla
Mango
Cioccolato
Questi sono sapori esclusivi
Nell'esempio sopra usiamo gli attributi Rowspan e Colspan
Tag per unire le righe e le colonne in una tabella.
Produzione
L'uscita sopra mostra che i tre marroni vengono uniti a causa di Rowspan e due colonne vengono unite a causa dell'uso di Colspan
Didascalia
In html Il tag viene utilizzato per dare la didascalia a una tabella. La didascalia fornisce informazioni riassunte sulla tabella. L'esempio seguente ti aiuta a capire meglio.
Esempio
Informazioni sul prodotto
Prodotto
Sapori
Latte
Mandorla
Mango
Cioccolato
Questi sono sapori esclusivi
Nell'output sopra che usiamo Tag per aggiungere una didascalia con una tabella in HTML.
Produzione
Questo output lo mostra Informazioni sul prodotto viene visualizzato sopra il tavolo a causa del etichetta.
Tavolo Intesta, corpo e piè di pagina
Le tabelle possono essere distribuite in tre parti se è necessario organizzare dati complessi. Queste parti sono intestazione, piè di pagina e un corpo. Il tag viene utilizzato per creare l'intestazione di una tabella, il tag viene utilizzato per creare il piè di pagina della tabella e
Il tag contiene il contenuto principale della tabella. Il seguente esempio ti aiuta a capire meglio.
Esempio
Prodotto
Sapori
Latte
Mandorla
Mango
Cioccolato
Questi sono sapori esclusivi
Nell'esempio sopra che usiamo Per specificare l'intestazione della tabella, quindi usiamo per specificare il contenuto principale del corpo e quindi viene utilizzato per specificare il piè di pagina del tavolo.
Produzione
L'output mostra che l'intestazione della tabella è scritta all'interno del tag, il nome del prodotto e la descrizione sono scritti all'interno
tag mentre contiene un breve messaggio.
Conclusione
In html,
tag è avvolto
tagg e
Tag per creare una tabella, mentre
tag specifica le righe e
Il tag specifica le colonne della tabella. In primo luogo, questo articolo mira a dimostrare come creare una tabella in HTML. Inoltre, abbiamo anche spiegato esempi su spaziatura delle celle, padding di celle, spanning di riga, spanning di colonne, capitalizzazione della tabella, tavolo da tavolo, tavolo-body e footer da tavolo.
