Šis raksts sniegs jums detalizētas un visaptverošas zināšanas par HTML tabulām. Dažādie tagi un formatēšana, ko var izdarīt.
Kopš tehnoloģiskās darbības sākuma tabula ir izplatīts datu glabāšanas un vizualizācijas veids. To izmanto gandrīz visos laukos, lai parādītu teksta informāciju un skaitliskus datus, kur jūs varat viegli salīdzināt divus vai vairākus elementus. Šajā rakstā es apspriedīšu Tabulas šādā secībā:
Vienkārši sakot, tabula ir saistītu datu kopums, kas sastāv no rindām un kolonnām. Tagad, kad mēs zinām, HTML ir standarta iezīmēšanas valoda, lai izveidotu tīmekļa lapas un parādītu to tīmekļa pārlūkprogrammā. Tātad, tabulu izveide un darbs ar tām kļūst par svarīgu HTML prasmju apguves prasmi. Šajā emuārā mēs uzzināsim, kā strādāt ar tabulām HTML.
Lai definētu HTML tabulu, mēs izmantojam
tagu. Iekšā
tagu, vispirms definējat tabulas rindas ar
tagu. Pēc tam jūs definējat tabulas galvenes
tagu. Dati vai šūna tabulā tiek definēta, izmantojot
tagu.
HTML tabulas tagi
Vispirms apskatīsim HTML tagu sarakstu, ko izmanto tabulu veidošanai. Vēlāk virzoties uz priekšu šajā emuārā, mēs uzzināsim, kā tos izmantot, izmantojot piemērus.
: Izmanto, lai definētu tabulu
: Izmanto, lai definētu galvenes šūnu tabulā
: Izmanto, lai definētu rindu tabulā
: Izmanto, lai definētu šūnu tabulā
:Izmanto, lai definētu tabulas parakstu
:Tiek izmantots, lai formatēšanai tabulā norādītu vienu vai vairākas kolonnas
: Tiek izmantots, lai norādītu kolonnu īpašības katrai kolonnai elementā
:Izmanto, lai grupētu galvenes saturu tabulā
: Izmanto ķermeņa satura grupēšanai tabulā
: Tiek izmantots kājenes satura grupēšanai tabulā
Tagad, lai izveidotu tabulu, apskatīsim HTML koda paraugu.
Nosaukums
Vecums
Abhishek
18
Bobs
2. 3
Izeja:
HTML tabulas variācijas
Cellpadding un Cellspacing atribūti
Ir divi atribūti, kurus sauc par cellpadding un cellspacing, kurus varat izmantot, lai pielāgotu tabulas šūnu atstarpi. Atribūts Cellspacing nosaka atstarpi starp tabulas šūnām, bet cellpadding attēlo attālumu starp šūnas robežām un šūnas saturu.
Šūnu atstatums un mobilā starplika
Nosaukums
Vecums
Abhishek
piecpadsmit
Bobs
2. 3
Colspan un Rowspan atribūti
Colspan atribūtu izmanto divu vai vairāku kolonnu sapludināšanai, savukārt rindu diapazonus izmanto divu vai vairāku rindu sapludināšanai.
HTML dod jums iespēju pielāgot galda augstumu un platumu. Platuma atribūtu un augstuma atribūtu izmanto, lai attiecīgi iestatītu tabulas platumu un augstumu. Varat to norādīt vai nu pēc ekrānā pieejamā laukuma procentuālā skaita, vai pēc pikseļiem.
HTML tabulas platums un augstums
Abhishek
piecpadsmit
Bobs
2. 3
Tabulas galvene, korpuss un kājene
Tabulu var sadalīt trīs sadaļās, t.i., galvenē, pamattekstā un kājenē. Galvene un kājene ir līdzīgas galvenei un kājenei Word dokumentā, kas joprojām ir kopīgs katrai lapai, turpretī pamatteksts satur galveno saturu.
tag izveido atsevišķu tabulas galveni, kur atzīme izveido atsevišķu tabulas kājeni. tagi satur tabulas pamattekstu.
HTML tabula ar galveni, kājeni un pamattekstu
Tabulas galvene
Galda kājene
Nosaukums
Vecums
Atzīmes
Tabulas foni un paraksti
Varat arī iestatīt tabulas fonu. Bgcolor atribūts nosaka fona krāsu visai tabulai, kā arī vienai šūnai, savukārt fona atribūts nosaka fona attēlu visai tabulai, kā arī tikai vienai šūnai.
Parakstu tags kalpo kā tabulas virsraksts vai skaidrojums tabulai, kas tiek parādīta tabulas augšdaļā.
HTML tabulas fons
Tabulas paraksts
1. kolonna
2. kolonna
3. kolonna
1. rindas šūna 1
1. rindas 2. šūna
1. rindas 3. šūna
2. rindas 2. šūna
2. rindas 3. šūna
3. rindas 1. šūna
Ar to mēs esam nonākuši pie šī raksta beigām. Tagad, izpildot iepriekš minētos fragmentus, jūs būtu sapratis, kā izveidot tabulas HTML. Es ceru, ka šis emuārs ir informatīvs un sniedz jums pievienoto vērtību.
PārbaudietAutors: Edureka, uzticams tiešsaistes mācību uzņēmums ar vairāk nekā 250 000 apmierinātu izglītojamo tīklu visā pasaulē.Tīmekļa attīstības sertifikācijas apmācība palīdzēs jums uzzināt, kā izveidot iespaidīgas vietnes, izmantojot HTML5, CSS3, Twitter Bootstrap 3, jQuery un Google API, un izvietot to Amazon Simple Storage Service (S3).
Vai mums ir jautājums? Lūdzu, pieminējiet to šī raksta komentāru sadaļā, un mēs ar jums sazināsimies.
