Kõik, mida peate teadma HTML-tabelite kohta



See artikkel annab teile üksikasjaliku ja põhjaliku HTML-tabelite tundmise. Erinevad sildid ja vormindamine, mida saab teha.

Alates tehnoloogilisest loomisest on tabel levinud viis andmete salvestamiseks ja visualiseerimiseks. Seda kasutatakse peaaegu kõigis väljades tekstiteabe ja arvandmete esitamiseks, kus saate hõlpsalt võrrelda kahte või enamat elementi. Selles artiklis arutlen Tabelid järgmises järjekorras:

Mis on HTML-tabel?

Lihtsamalt öeldes on tabel seotud andmete kogum, mis koosneb ridadest ja veergudest. Nüüd, kui me teame, on HTML tavaline märgistuskeel veebilehtede loomiseks ja selle kuvamiseks veebibrauseris. Seega saab tabelite loomine ja nendega töötamine HTML-i valdamiseks oluliseks oskuseks. Selles ajaveebis õpime, kuidas töötada HTML-vormingus tabelitega.





HTML5
HTML-tabeli määratlemiseks kasutame

silt. Toas
märgendiga määrate kõigepealt tabeli read silt. Järgmisena määratlete tabeli päised sildid sisaldavad tabeli keha.

HTML-tabel päise, jaluse ja kehaga
silt. Andmed või lahtrid tabelis määratletakse silt.

HTML tabeli sildid

Vaatame kõigepealt tabelite loomiseks kasutatud HTML-siltide loendit. Hiljem selles blogis edasi liikudes õpime nende kasutamist näidete abil.



  • :Kasutatakse tabeli määratlemiseks
  • :Kasutatakse tabeli rea määratlemiseks
  • : Kasutatakse keha sisu tabelis rühmitamiseks
  • : Kasutatakse jaluste sisu tabelis rühmitamiseks
  • Nüüd vaatame tabeli loomiseks HTML-koodi näidist.

     
    : Kasutatakse tabeli päiseraku määramiseks
  • : Kasutatakse tabeli lahtri määratlemiseks
  • : Kasutatakse tabeli pealdise määratlemiseks
  • : Kasutatakse tabelis ühe või mitme veeru rühma määramiseks vormindamiseks
  • : Kasutatakse veeru omaduste määramiseks iga elemendi veeru jaoks
  • : Kasutatakse päise sisu rühmitamiseks tabelisse
  • Nimi Vanus
    Abhishek 18
    Bob 2. 3

    Väljund:



    HTML-tabeli variatsioonid

    • Cellpadding ja Cellspacing atribuudid

    Seal on kaks atribuuti, mida nimetatakse kärjetäiteks ja lahtriruumideks, mida saate kasutada oma laua lahtrites valge ruumi reguleerimiseks. Atribuut Cellspacing määratleb tabelirakkude vahelise ruumi, samas kui cellpadding tähistab lahtrite piiride ja lahtris oleva sisu vahelist kaugust.

    Lahtriruum ja kärjepadi
    Nimi Vanus
    Abhishek viisteist
    Bob 2. 3

    tabeli andmete segamine vasakpoolne liitumine
    • Colspan ja Rowspan atribuudid

    Atribuuti Colspan kasutatakse kahe või enama veeru ühendamiseks, samas kui ridade vahemikke kasutatakse kahe või enama rea ​​ühendamiseks.

    Colspan & Rowspan
    Partii Nimi Vanus
    Arvutiteadus Abhishek viisteist
    Bob 2. 3
    Break

    • Laua kõrgus ja laius

    HTML annab teile võimaluse tabeli kõrguse ja laiuse reguleerimiseks. Atribuut Width & height kasutatakse tabeli laiuse ja kõrguse määramiseks vastavalt. Võite selle määrata kas ekraanil saadaoleva ala protsendina või pikslite kaupa.

    HTML-tabeli laius ja kõrgus
    Abhishek viisteist
    Bob 2. 3

    • Tabeli päis, keha ja jalus

    Tabeli saab jagada kolmeks osaks, st päiseks, kehaks ja jaluseks. Päis ja jalus sarnanevad sõnalise dokumendi päise ja jalusega, mis jääb iga lehe jaoks tavaliseks, samas kui põhiosa sisaldab põhiosa.

    silt loob eraldi tabeli päise, kusjuures märgis loob eraldi tabeli jaluse.

Tabeli päis
Lauajalus
Nimi Vanus Märgid

  • Tabeli taustad ja pealdis

Samuti saate määrata tabeli tausta. Bgvärv atribuut määrab taustavärvi nii kogu tabelile kui ka ühele lahtrile, taustatribuut aga taustpildi nii kogu tabelile kui ka ainult ühele lahtrile.

Subtiitrimärgend on tabeli ülaosas kuvatava tabeli pealkiri või selgitus.

HTML-i tabeli taustTabeli pealdis
1. veerg 2. veerg 3. veerg
1. rida Lahter 1 1. rida lahter 2 1. rea lahter 3
2. rida Lahter 2 2. rea lahter 3
3. rida Lahter 1

Sellega jõuame selle artikli lõpuni. Pärast ülaltoodud juppide käivitamist oleksite aru saanud, kuidas HTML-i tabeleid luua. Loodan, et see ajaveeb on informatiivne ja annab teile lisaväärtust.

Vaadake Edureka, usaldusväärne veebiõppeettevõte, mille võrgustik hõlmab üle 250 000 rahuloleva õppija, levinud üle kogu maailma. Veebiarenduse sertifitseerimiskoolitus aitab teil õppida muljetavaldavaid veebisaite looma HTML5, CSS3, Twitter Bootstrap 3, jQuery ja Google API-de abil ning juurutada see Amazon Simple Storage Service'i (S3).

Kas teil on meile küsimus? Palun mainige seda selle artikli kommentaaride jaotises ja võtame teiega ühendust.