Tabelele în HTML5 - partea 1

Cuprins
În trecut, tabelele HTML erau folosite pentru a controla aspectul site-urilor, pentru a menține proporțiile conținutului, a crea secțiuni, a împărți informațiile etc. În prezent, aceasta este o practică proastă, de fapt cu noile specificații ale articolului masa În HTML5, s-au depus toate eforturile pentru ca aceasta să fie folosită pentru adevăratul său scop, care este de a afișa date în matrice bidimensionale.
Element de masă
Elementul masa este marele container și poate fi în interiorul oricărui element care este flux, cum ar fi div. Element interior masa vom avea elementele: subtitrare, colgroup, thead, tbody, tfoot, tr, th Da td, care sunt necesare pentru a da constituția mesei noastre, în plus, noul standard a făcut ca următoarele atribute să devină învechite în interior masa și trebuie să fie utilizate exclusiv de CSS: rezumat, aliniați, lățime, bgcolor, cellpadding, cellspacing, cadru, reguli. Convenția CSS pentru acest element va fi următoarea:
 table {display: table; border-colaps: separat; spațiere la margine: 2 px; culoarea chenarului: gri; } 

Tr element
După cum știm bine, tabelele sunt compuse din două elemente de bază, rânduri și coloane, unde rândurile reprezintă fiecare înregistrare de informații, iar coloanele structura și tipul informației, să vedem elementul utilizat pentru a crea rândurile, acest element este tr. Acesta poate fi un copil al următoarelor elemente: masă, cap, tălpă, corpDupă cum putem vedea, poate fi un copil direct al unei mese sau un copil al elementelor care sunt copii ai mesei și care definesc structura acesteia. Trebuie să conțină 1 sau mai multe articole td sau a după caz, unele dintre atributele sale învechite au fost plasate și în noul standard HTML5, acestea fiind: align, char, charoff, valign, bgcolor. Care trebuie să fie lucrate exclusiv de CSS, a spus că CSS are următoarea structură ca convenție:
 tr {display: table-row; vertical-align: moșteni; border-color: mostenesc;} 

Td element
Acest element definește coloanele din rândurile noastre din tabel, ceea ce ne permite să separăm informațiile într-o înregistrare și astfel să le putem clasifica în funcție de nevoile noastre, este un copil al elementului tr, atributele valide pe care le poate avea sunt: colspan, envergură, anteturi iar atributele învechite care acum trebuie tratate în CSS sunt: abbr, ax, align, width, char, charoff, valign, bgcolor, height, nowrap, scope. Convenția CSS pentru acest element este după cum urmează:
td {display: table-cell; vertical-align: moșteni; }

Prima noastră masă
Să punem în practică ceea ce am văzut până acum, știm deja că pentru tabelul nostru avem nevoie de rânduri și coloane în container sau elementul părinte, să vedem cum îl ducem la cod HTML:
 Exemplu 
Merele Verde Mediu
Portocale portocale Mare

Acest cod ne oferă structura unui tabel cu 2 rânduri cu 3 coloane, deoarece vedem că este un text simplu, ceea ce ne determină să vedem acest rezultat:

După cum putem vedea, este destul de ușor să creați un tabel în HTML5 în momentul în care este doar text și fără formatare, în următoarea parte a tutorialului vom vedea cum să creați un tabel puțin mai avansat cu conținut CSS.V-a plăcut și ați ajutat acest tutorial?Puteți recompensa autorul apăsând acest buton pentru a-i oferi un punct pozitiv

Vei ajuta la dezvoltarea site-ului, partajarea pagina cu prietenii

wave wave wave wave wave