Detaljni vodič za početak rada s HTML tablicama

HTML tablica

Pregled

Web je prepun informacija poput nogometnih rezultata, kriket rezultata, popisa zaposlenika i adresa e-pošte. HTML tablice omogućuju vam prikazivanje podataka u uobičajenim podacima kao tablični podaci.

NAPOMENA: Već sam dodao Styling koristeći CSS, tako da će moji elementi izgledati drugačije. Ali oni će raditi na potpuno isti način.
Ako želite da vaši elementi izgledaju kao moji, moju CSS datoteku možete pronaći na donjim vezama:
CSS: https://gist.github.com/abhishekjakhar/2ea51dfc0dcf6f6ed0d44ac0e72f9c54

Osnovna tablica

Možemo stvoriti HTML tablicu pomoću elementa tablice. Ima oznaku otvaranja i zatvaranja i ona unutar sebe omota sve redove tablica i ćelije tablice.

 

Sada upišite red tablice. Tablice su sastavljene od reda informacija koje idu preko stranice. Element koristi se za izradu retka tablice.

Međutim, ne postoji element za stupac tablice. Stupci tablice ovise o broju ćelija tablice unutar svakog retka. Element koristi se za stvaranje ćelije tablice. U osnovi, broj elemenata koje ćete dodati unutar elementa je točno isti broj stupaca koji ćete dobiti unutar retka tablice.

Za ponovni izračun:

  • : Element tablice predstavlja podatke u nizu redaka i stupaca. Tablice se trebaju koristiti samo za prikaz tabličnih podataka, a nikako za izgled stranice.
  • : Element retka tablice definira red ćelija u tablici. Redovi tablice mogu se napuniti stanicama tablice i ćelijama zaglavlja tablice.
  • : Element ćelije tablice sadrži podatke i predstavlja jednu ćeliju tablice. Svaka ćelija tablice trebala bi biti unutar retka tablice.elementi retka tablice (<tr>) i ćelije tablice (<td>) zajedno da tvore tablicu
    Napomena: elementi nemaju atribute. Ako ste ranije radili sa tablicama, možda ste nekada koristili neke atribute. Međutim, sada su svi zastarjeli.

    Element zaglavlja tablice

    Stvorili smo osnovnu tablicu, ali nije jasno da je naš prvi red u tablici zapravo pokušaj označavanja svakog našeg stupca. Trenutno prvi red jednostavno izgleda kao drugi red u našoj tablici.

    Možemo upotrijebiti element zaglavlja tablice u svakom od ova tri stupca da bismo pretraživaču, pretraživačima pretraživača i čitačima zaslona rekli da su to zapravo zaglavlja, a ne samo redoviti podaci.

    Sada ćemo mijenjati stanice tablice u prvom redu u ćeliju zaglavlja tablice. Da bismo to postigli zamijenit ćemo

    - Element glave tablice (ne smije se brkati s elementom ćelije zaglavlja tablice) definira skup redaka koji čine zaglavlje tablice.
  • - Element tijela tablice definira jedan ili više redaka koji čine primarni sadržaj (ili "tijelo") tablice.elementi glave tablice (<thead>) i tijela tijela (<tbody>)

    Element stopala stola

    Imamo glavu stola i element tijela stola. Naravno, tu je i element stopala. No, pitanje je koja je poanta elementa podnožja tablice kada već imamo zaglavlja tablica koje označavaju stupce?

    Općenito, element podnožja tablice treba sadržavati sažetak tablice. To mogu biti neke završne ćelije koje sadrže zbrojeve, zbrojeve i prosjeke za svaki stupac. Može sadržavati i neke meta podatke poput podataka o autorskim pravima ili izvora podataka unutar tablice.

    Sada biste pomislili da će podnožje stola ići na dnu stola. Međutim, zapravo bi trebao krenuti odmah nakon elementa glave tablice i neposredno prije elementa tijela tablice.

    - Element podnožja tablice definira skup redaka koji sažimaju stupce tablice.element stopala (<tfoot>)

    Element opisa

    Ovaj je element u osnovi naslov tablice, a trebao bi doći odmah nakon oznake uvodne tablice. Ovo je lijepo dodati jer brzo sažima što tablica može sadržavati.

    Sada smo pokrili osnove elemenata tablice u HTML-u.

    Više o tablicama možete saznati na donjim vezama.

    Nadam se da ste pronašli ovaj post informativnim i korisnim. Volio bih čuti vaše povratne informacije!

    Hvala na čitanju!

    highresolution-wallpapers.net © 2020
    s .

    Tekst u prvom redu je podebljaniji od ostalih redova zbog <th> elementa koji se koristi unutar prvog <tr>

    Glava i tijelo stola

    Slično strukturi našeg HTML dokumenta, gdje imamo glavu i tijelo, također možemo dodati glavu i tijelo našem stolu. Sigurno nećemo koristiti iste HTML elemente jer će tada sintaksa postati nevažeća. Za stol imamo za glavu i za tijelo.