Introducere în crearea tabelelor în HTML

Tabelul este unul dintre cele mai utile constructe. Tabelele sunt peste tot aplicația web. Principala utilizare a tabelului este aceea că sunt utilizate pentru structurarea informațiilor și pentru structurarea informațiilor pe pagina web. Un tabel HTML este un aspect de pagină pe bază de tabel. Tabelele nu trebuie utilizate ca instrumente de aranjare. În acest articol, vom discuta despre Crearea tabelelor în HTML.

Tabel HTML

  • tag-ul este utilizat pentru a crea un tabel.
  • În HTML, un tabel este considerat ca un grup de rânduri care conține fiecare grup de celule.
  • Pot fi multe coloane la rând.
  • Tabelele HTML trebuie utilizate doar pentru date tabulare, dar sunt utilizate și pentru crearea paginilor web de aspect.
  • Dacă construim tabele HTML fără stiluri sau atribute în browser, acesta va fi afișat fără margini.
  • Eticheta tabelului:
  • Conținutul pe care îl scriem între aceste etichete va fi afișat în tabel.

Etichete utilizate în HTML

Mai jos sunt prezentate câteva dintre etichetele utilizate în tabel.

1. Etichetă

  • tag-ul este utilizat pentru a defini un rând în tabelul HTML.
  • vom începe rândul cu începutul prin rândul etichetei și apoi construim rândul prin crearea fiecărei celule și când terminăm toate celulele pentru un rând, vom închide rândul cu eticheta rândului final .
  • Etichetă de rând:

2. Etichetă

  • tag-ul este utilizat pentru a defini datele pentru celula din tabelul HTML.
  • Vom crea fiecare celulă cu eticheta celulelor de început apoi adăugați conținutul sau datele în celulă și apoi închideți celula cu eticheta celulă finală.
  • Etichetă de celule:

3. Etichetă

  • tag este utilizat pentru a defini celula antet într-un tabel HTML.
  • Celula antet din tabel este utilizată pentru a furniza informații pentru celulele rămase ale coloanei.
  • Etichetă antet:
  • De obicei este plasat în partea de sus a celulelor.

4. Etichetă

  • Eticheta este utilizată pentru a specifica culoarea de fundal a tabelului.

Sintaxă:

  • Pentru numele culorii putem furniza direct numele culorii pentru fundal. De exemplu, putem specifica
  • Pentru numărul hex_număr trebuie să specificăm codul hexadecimal pentru fundal. De exemplu
  • Pentru rgb_number trebuie să specificăm codul rgb (Roșu, Verde, Albastru) pentru fundal. De exemplu
  • În rgb_number dacă furnizăm toate valorile ca 255, ieșirea culorii de fundal este albă.

    • 5. Etichetă

    • Eticheta este folosită pentru a oferi subtitrarea în tabel.
    • Acesta este plasat sau utilizat imediat după
    etichetă.
  • În mod implicit, titlul tabelului va fi aliniat în centru deasupra tabelului.
  • Etichetă de legendă:

    • 6. Răspândirea celulelor

    • Spanning nu este decât combinarea a două sau mai multe celule adiacente din tabel.
    • Este format din col span și range range.
    • Col span : atributul col span specifică numărul de coloane pe care trebuie să le întindă o celulă de tabel.
    Etichetă
    tag-ul este utilizat pentru a grupa conținutul corpului în tabelul HTML.
  • Tabelele pot conține mai multe corpuri în unele tabele, în celălalt caz, tabelul poate conține un singur corp, în aceste cazuri,
    • poate fi îndepărtat.
  • Tabelele cu un singur corp vor avea un corp implicit.
  • Sintaxa:

    • 9. Etichetă

    • Eticheta conține rânduri care reprezintă un subsol sau un rezumat.
    • Sintaxa:

    10. Etichetă

    • Coloanele tabelului pot fi grupate împreună cu elementul.
    • Fiecare element declarat în bloc va defini un grup cu ajutorul atributului span, care va indica numărul de coloane care vor aparține grupului.
    • Este util pentru aplicarea stilurilor pentru întregi coloane în loc să se repete pentru fiecare rând sau celulă.
    • Sintaxa:

    Exemple de etichete HTML

    Exemplul 1

    1. Tabel:

    Sintaxa:

  • Întotdeauna ia o valoare întreagă.
  • Interval de rânduri : atributul de întindere a rândurilor specifică numărul de rânduri pe care trebuie să le întindă o celulă de tabel.
  		•
  • Întotdeauna ia o valoare întreagă.

    • 7. Etichetă

    • definește un set de rânduri care definesc capul coloanelor tabelului.

    Sintaxa:

    8.

    ieşire:

    • În acest exemplu, am creat un tabel cu trei rânduri. După cum putem observa din ieșire că nu conține nicio frontieră. Deci, de fiecare dată când creăm un tabel fără CSS sau nu folosim niciun stil, acesta va afișa ieșire fără margini.

    Exemplul 2

    ieşire:

    • În acest exemplu, putem vedea că avem o margine la ieșirea noastră, oferind proprietatea de frontieră în secțiunea de stil și folosind-o într-o etichetă de tabel.

    2. Tag și Etichetă

    Sintaxă: ……..

    Exemplu:

    ieşire:

    • În acest exemplu, am creat pur și simplu două rânduri cu eticheta și datele sunt introduse utilizând etichetă.

    3. Etichetă:

    Sintaxă:

    Exemplu:

    ieşire:

    • În acest exemplu, putem observa că numele și prenumele sunt cu caractere aldine în comparație cu altele, deoarece sunt declarate anteturi ale celulelor folosind etichetă.

    4.

    Sintaxă: table bgcolor = “color_name|hex_number|rgb_number”> ;

    Exemplu:

    ieşire:

    5.

    Sintaxă:

    Exemplu:

    ieşire:

    • În acest exemplu, am adăugat o legendă în tabel ca detalii ale studenților, folosind tag-ul de legendă.

    6. Col Span și Row Span

    Sintaxa pentru col span:

    Sintaxa pentru Row Span:

    Exemplu pentru col span:

    ieşire:

    Exemplu pentru rândul de frecvență:

    ieşire:

    7.

    Sintaxă:

    8.

    Sintaxă:

    9.

    Sintaxă:

    Exemplu:

    ieşire:

    10. Colgrup

    Sintaxă:

    Exemplu:

    ieşire:

    Concluzie - Creați tabele în HTML

    În HTML utilizând

    tag putem crea mai multe tabele și chiar putem grupa rândurile și coloanele. Putem face chiar mai mult stilul tabelelor folosind CSS.

    Articole recomandate

    Acesta este un ghid pentru crearea tabelelor în HTML. Aici vom discuta despre cum se creează un tabel în HTML cu exemple și despre cum se utilizează etichete HTML. Puteți parcurge și alte articole propuse -

    1. Editori de text HTML
    2. Elemente de formulare HTML
    3. Etichete de imagine HTML
    4. Atribute HTML
    5. Rame HTML
    6. Blocuri HTML
    7. Setați o culoare de fundal în HTML cu Exemplu

    Categorie:

    Instrumente de dezvoltare web