Etichete de tabel HTML - Aflați exemple de etichete de tabel HTML cu sintaxă

• Introducere pe etichetele tabelului HTML

Introducere pe etichetele tabelului HTML

Tabelul HTML oferă o modalitate de a deriva sau defini datele, cum ar fi text, imagini, legături, etc, în termeni de rânduri și coloane de celule. Tabelele HTML pot fi create prin utilizarea

etichetă. În mod implicit, datele tabelului sunt aliniate. În acest subiect, vom afla despre etichetele tabelelor HTML.

Tabelul poate fi creat folosind

Etichete.

tag specifică rândurile de tabel care sunt utilizate pentru a face un rând.

Datele tabelului pot fi structurate în

.	, și
tag definește un titlu pentru tabel.	tag specifică celulele de date din tabel care sunt utilizate pentru a realiza coloana.

conținutul tabelului cu numeroase elemente de masă.

Sintaxă

Titlul tabelului 1	Titlul tabelului 2
Celula de date 1	Celula de date 2
Celula de date 3	Celula de date 4

Exemple de etichete de tabel HTML

Iată exemple de etichete de tabel HTML date mai jos

1. Utilizarea tabelului de bază



HTML Table Tag Usage



Nume	Țară
Dhoni	India
David Miller	Africa de Sud
Joe Root	Anglia

Salvați codul cu extensia .html și deschideți-l în browser. Va afișa următoarea ieșire:

2. Legenda tabelului

Legenda pentru tabel poate fi specificată folosind eticheta < legendă > .

Exemplu



HTML Table Tag Usage



Aceasta este Legenda tabelului

Nume	Țară
Dhoni	India
David Miller	Africa de Sud
Joe Root	Anglia

Codul de mai sus va afișa ieșirea de mai jos:

3. Distanța celulelor de tabel

Spațiul celulelor tabelului poate fi definit folosind atributul cellpacing. Atributul cellpacing specifică spațiul dintre celulele tabelului.

Exemplu



HTML Table Tag Usage



Nume	Țară
Dhoni	India
David Miller	Africa de Sud
Joe Root	Anglia

Codul de mai sus va afișa următoarea ieșire:

4. Completarea celulelor de masă

Căptușirea celulelor tabelului poate fi definită folosind atributul cellpadding. Atributul de celulare distanță între granița celulelor tabelului și date.

Exemplu



HTML Table Tag Usage



Nume	Țară
Dhoni	India
David Miller	Africa de Sud
Joe Root	Anglia

Codul de mai sus va afișa ieșirea de mai jos:

5. Atribute ale coloanei și ale rândurilor

Cele două sau mai multe rânduri de tabel pot fi îmbinate într-un singur rând prin utilizarea atributului rowpan și coloanele tabelelor pot fi comasate într-o singură coloană folosind un atribut colspan.

Exemplu



HTML Table Tag Usage



Coloana Unu	Coloana Două	Coloana Trei
Rândul unu	Rândul doi	Rândul trei
	Rândul Patru	Rândul cinci
Rândul șase

Codul va afișa următoarea ieșire:

6. Fundal pentru tabel

Fundalul tabelului poate fi creat folosind atributul bgcolor. Bordul celulelor tabelului poate fi specificat folosind atributul border-color.

Exemplu



HTML Table Tag Usage



Nume	Țară
Dhoni	India
David Miller	Africa de Sud
Joe Root	Anglia

Executați codul de mai sus și va afișa ieșirea de mai jos:

7. Înălțimea și lățimea tabelului

Înălțimea și lățimea mesei pot fi setate folosind atribute de lățime și înălțime.

Exemplu



HTML Table Tag Usage



Nume	Țară
Dhoni	India
David Miller	Africa de Sud
Joe Root	Anglia

Codul de mai sus va afișa următoarea ieșire:

8. Stilizarea celulelor de masă

Exemplu



HTML Table Tag Usage

table, th, td (
border: 1px solid red;
border-collapse: collapse;
)
th, td (
padding: 15px;
)
table#mytable tr:nth-child(even) (
background-color: #FAD7A0;
)
table#mytable tr:nth-child(odd) (
background-color: #E67E22;
)
table#mytable th (
color: white;
background-color: teal;
)



Nume	Țară
Dhoni	India
David Miller	Africa de Sud
Joe Root	Anglia

Executați codul de mai sus, veți avea rezultatul de mai jos:

8. Tabelele cuiburi

Puteți utiliza o tabelă în interiorul altei mese, se numește tabel imbricat

Să luăm în considerare exemplul de mai jos pentru tabelul cuibărit:

Exemplu



HTML Table Tag Usage



Nume Țară Dhoni India David Miller Africa de Sud Joe Root Anglia

Codul de mai sus va afișa următoarea ieșire:

Atributele tabelului

• aliniere: Acest atribut oferă alinierea conținutului în interiorul unui element.
• bgcolor: Acest atribut specifică culoarea de fundal pentru tabel.
• border: Acest atribut specifică chenarul pentru celulele tabelului.
• celpadding: Acest atribut afișează umplerea între celulele tabelului și conținutul tabelei.
• cellpacing: Acest atribut afișează spațiul dintre celulele tabelului.
• cadru: specifică ce părți ale marginilor exterioare sunt vizibile.
• reguli: Aceasta specifică ce părți ale marginilor interioare sunt vizibile.
• sortabil: Acest atribut informează că tabelul poate fi sortabil.
• rezumat: oferă ce tip de conținut de tabel este prezent.
• width: Acest atribut indică lățimea tabelului.
• înălțime: Acest atribut specifică înălțimea tabelului.

Concluzie

Până în prezent, am studiat diferitele tipuri de etichete de tabel în HTML. Exemplele au arătat utilizarea stilării tabelei, cuibarea unei mese în cadrul altei tabele, setarea înălțimii și lățimii mesei, adăugarea spațierii și căptușelii pentru celulele mesei, aplicarea culorii de fundal pentru masă și multe altele.

Articole recomandate

Acesta este un ghid pentru etichetele de tabel HTML. Aici discutăm Exemplele de etichete de tabel HTML cu sintaxă și atribute ale tabelului. De asemenea, puteți arunca o privire la următoarele articole pentru a afla mai multe -

1. Elemente de formulare HTML
2. Creați tabele în HTML
3. Etichete de imagine HTML
4. Ce este HTML
5. Rame HTML
6. Blocuri HTML
7. Setați o culoare de fundal în HTML cu Exemplu