I dagens moderne verden er nesten alt på nettet enten det er å handle, selge, administrere kontoer osv. på grunn av hvilke en enorm mengde data er nødvendig for å være organisert. Men her er spørsmålet hvordan vi organiserer den enorme mengden data? Så svaret på dette problemet er veldig enkelt, vi kan organisere data ved hjelp av tabeller. I HTML spiller tabeller en viktig rolle i organisering av data som forbedrer interaktiviteten til grensesnittet.
Denne artikkelen guider deg til å lage tabell i HTML og serverer følgende utfall: Denne artikkelen vil fortelle
Hvordan lage en tabell i HTML
Tabelloverskrift
Tabellcellersport og cellpadding
Bord rowspan og colspan
Bordtekst
Header, kropp og bunntekst for bordet
Hvordan lage en tabell i HTML
En HTML -tabell brukes til å organisere data i rader og kolonner. For å lage en tabell i HTML bruker vi
tagg og for å lage rader i en tabell
Tag brukes mens du lager celler i en tabell vi bruker
stikkord. Følgende eksempel gir deg et klart syn på hvordan du lager en tabell i HTML.
Eksempel
BORD
Smør
3 kilo
Melk
3 liter
I eksemplet ovenfor lager vi en enkel tabell med to rader og celler. En tabell opprettes ved å bruke
Tag sammen med grenseattributtet. Deretter inne i en
Tag vi bruker
Tag for å lage tabellrekke og inne
Tag vi bruker
Tag for å lage kolonner inne i en rad.
Produksjon
Som du ser har vi et bord med to rader og kolonner som forventet.
Tabelloverskrift
Vi bruker
Tag for å sette inn overskrift i en tabell. Følgende eksempel forklarer det tydelig
Eksempel
BORD
Produkt
Mengde
Smør
3 kilo
Melk
3 liter
I dette eksemplet har vi brukt
Tag for å gi overskrifter til kolonnen.
Produksjon
Slik legger vi til en overskrift til et bord.
Tabellcellersport og cellpadding
Disse to attributtene brukes til justering av celleavstand.
Cellesport: Denne attributtet legger til mellomrom mellom cellene.
Cellpadding: Denne attributtet spesifiserer avstanden til celleinnhold fra cellegrensen.
Disse attributtene kan brukes med
KUN bare. Følgende eksempel hjelper deg å forstå disse attributtene bedre.
Eksempel 1
Produkt
Mengde
Smør
3 kilo
Melk
3 liter
I dette eksemplet bruker vi cellesport -attributtet i
Merk og sett verdien til 10 som legger til mellomrom mellom cellene i tabellen.
Produksjon
Utgangen viser tydelig resultatet for cellesport som legger til mellomrom mellom cellene.
Eksempel 2
Følgende kode benytter seg av cellpadding til en tabellcelle.
Produkt
Mengde
Smør
3 kilo
Melk
3 liter
I dette eksemplet bruker vi cellpadding -attributtet i
Merk og sett verdien til 10 som legger til mellomrom mellom celleinnhold og celleoverskridende av tabellen.
Produksjon
Denne utgangen viser resultatet for cellpadding.
Bord rowspan og colspan
Disse to attributtene brukes til å slå sammen rader og kolonner.
Rowspan: To eller flere rader kan slås sammen ved å bruke dette attributtet.
Colspan: To eller flere kolonner kan slås sammen ved å bruke dette attributtet.
Disse attributtene kan brukes med
KUN bare. Følgende eksempel hjelper deg å forstå disse attributtene bedre.
Eksempel
Produkt
Smaker
Melk
Mandel
Mango
Sjokolade
Dette er eksklusive smaker
I eksemplet ovenfor bruker vi Rowspan- og Colspan -attributter med
Tag for å slå sammen radene og kolonnene i en tabell.
Produksjon
Ovennevnte utgang viser at de tre brune er slått sammen på grunn av rowspan og to kolonner er slått sammen på grunn av bruk av colspan
Bordtekst
I HTML Tag brukes til å gi bildetekst til et bord. Bildetekst gir en oppsummert informasjon om tabellen. Følgende eksempel hjelper deg å forstå bedre.
Eksempel
Produktinfo
Produkt
Smaker
Melk
Mandel
Mango
Sjokolade
Dette er eksklusive smaker
I ovennevnte utgang bruker vi Tag for å legge til en bildetekst med et bord i HTML.
Produksjon
Denne utgangen viser det Produktinfo vises over bordet på grunn av stikkord.
Bord Header, kropp og bunntekst
Tabeller kan distribueres i tre deler hvis komplekse data må organiseres. Disse delene er overskrift, bunntekst og en kropp. Tag brukes til å lage overskriften til en tabell, tag brukes til å lage bunnteksten på bordet og
Tag inneholder hovedinnholdet i tabellen. Følgende eksempel hjelper deg å forstå bedre.
Eksempel
Produkt
Smaker
Melk
Mandel
Mango
Sjokolade
Dette er eksklusive smaker
I eksemplet ovenfor bruker vi For å spesifisere topptabellen, bruker vi deretter for å spesifisere hovedinnholdet i kroppen og deretter brukes til å spesifisere bunnteksten på tabellen.
Produksjon
Utgangen viser at tabelloverskriften er skrevet i taggen, produktnavnet og beskrivelsen er skrevet inne
Tag mens du inneholder en kort melding.
Konklusjon
I HTML,
Tag er pakket rundt
tag og
tagg for å lage en tabell, mens
Tag spesifiserer radene og
TAG spesifiserer kolonnene i tabellen. Primært har denne artikkelen som mål å demonstrere hvordan du lager en tabell i HTML. I tillegg har vi i tillegg også forklart eksempler på celle-pacing, cellespadding, radspennende, kolonnespennende, tabellkapp, bordhode, bordkropp og bordfoter.
