Za kombiniranje dvije ili više ćelija u jednu, koriste se atributi colspan i rowspan oznake.
Primjer 12.3. Nevažeće spajanje ćelija
| Ćelija 1 | Ćelija 2 | |
| Ćelija 3 | Ćelija 4 | |
Rezultat ovog primjera prikazan je na Sl. 12.5.
Pirinač. 12.5. Pojava dodatne ćelije u tablici
Prvi red primjera ima tri ćelije, dvije su spojene pomoću atributa colspan, a druga linija dodaje samo dvije ćelije. Ovo stvara dodatnu ćeliju koja se prikazuje u pregledniku. Jasno se vidi na sl. 12.5.
Primjer 12-4 pokazuje ispravnu upotrebu atributa colspan i rowpan.
Primjer 12.4. Spojite ćelije okomito i vodoravno
| Pretraživač | Internet Explorer | Opera | Firefox | ||||
|---|---|---|---|---|---|---|---|
| 6.0 | 7.0 | 7.0 | 8.0 | 9.0 | 1.0 | 2.0 | |
| Podržano | Ne | Da | Ne | Da | Da | Da | Da |
Rezultat ovog primjera prikazan je na Sl. 12.6.
Pirinač. 12.6. Tablica sa spojenim ćelijama
Ova tablica ima osam stupaca i tri reda. Neke ćelije s riječima "Internet Explorer", "Opera" i "Firefox" kombiniraju se gdje dvije, a gdje tri ćelije. Okomito spajanje primijenjeno u ćeliji s oznakom "Preglednik".
Reći ću vam detaljno i detaljno kako kombinirati ćelije okomito i vodoravno u tablicama.
U ovom članku nećemo objašnjavati principe stvaranja html tabela; da biste stekli ovo znanje, pohađajte naš kurs HTML.
Za kombiniranje ćelija unutar tablice, oznaci su dodijeljena dva atributa
Neki ljudi imaju poteškoća u korištenju ovih atributa, problema sa spajanjem ćelija.
Atributi colspan i rowspan uzimaju cijele vrijednosti od 0 do 1000 kao parametre. Evo malog primjera kako možete kombinirati ćelije u tablici.
Na prvi pogled, implementirana je ne baš složena struktura, ali gledajući obilje
Nudimo vam svestran i vrlo prikladan način za kombiniranje ćelija.
Za početak, pripremite prazno mjesto vaše buduće tablice, prezentirajući mu sve ćelije odvojene. To može biti stol 3x3, 6x10 itd. Svakoj ćeliji ćemo dati vlastiti broj, počevši brojati slijeva nadesno i odozgo prema dolje.
Analizirajmo stvaranje gore prikazane tablice pomoću ove metode.
Ovako će izgledati kôd našeg predloška i sam predložak:
| 1 | 2 | 3 | 4 |
| 5 | 6 | 7 | 8 |
| 9 | 10 | 11 | 12 |
| 13 | 14 | 15 | 16 |
| 1 | 2 | 3 | 4 |
| 5 | 6 | 7 | 8 |
| 9 | 10 | 11 | 12 |
| 13 | 14 | 15 | 16 |
Morate vodoravno spojiti ćelije s brojevima 1,2,3. Da biste to učinili, u kôd, ćeliju broj 1, dodajte atribut colspan s vrijednošću 3. I uklonite
| 1,2,3 | 4 | ||
| 5 | 6 | 7 | 8 |
| 9 | 10 | 11 | 12 |
| 13 | 14 | 15 | 16 |
| 1,2,3 | 4 | ||
| 5 | 6 | 7 | 8 |
| 9 | 10 | 11 | 12 |
| 13 | 14 | 15 | 16 |
Sada moramo okomito spojiti ćelije 9 i 13. Izvodimo sličan postupak - postavite atribut rowpan na ćeliju broj 9 s vrijednošću 2, izbrišite ćeliju s broja 13, upišite brojeve ćelija od kojih se sastoji spojena ćelija.
Ovo će promijeniti naš kôd i izgled tablice:
| 1,2,3 | 4 | ||
| 5 | 6 | 7 | 8 |
| 9,13 | 10 | 11 | 12 |
| 14 | 15 | 16 | |
| 1,2,3 | 4 | ||
| 5 | 6 | 7 | 8 |
| 9,13 | 10 | 11 | 12 |
| 14 | 15 | 16 | |
Ostaje spojiti 11,12,15,16 ćelija u jednu. Da biste to učinili, u ćeliju br. 11 upišite atribute colspan = "2" rowspan = "2". Uklanjamo ćelije 12,15,16 iz koda. U kombiniranu ćeliju upisujemo brojeve 11,12,13,14.
Ovo će promijeniti naš kôd i izgled tablice:
| 1,2,3 | 4 | ||
| 5 | 6 | 7 | 8 |
| 9,13 | 10 | 11,12,15,16 | |
| 14 | |||
| 1,2,3 | 4 | ||
| 5 | 6 | 7 | 8 |
| 9,13 | 10 | 11,12,15,16 | |
| 14 | |||
To je sve, dobili smo originalnu tablicu, sada ćelije mogu biti ispunjene podacima koji su vam prikladni.
Nadamo se da razumijete princip stvaranja složenih tablica sa spojenim ćelijama.
HTML tabele imaju dve funkcije. Prvi su same tablice, odnosno izlaz informacija u obliku tablice. A drugi je izgled stranice. Zasebni dijelovi sadržaja smješteni su u različite ćelije tablice i tako se pojavljuju na pravom mjestu na stranici.
Kreiranje tabele
Pogledajmo kako stvoriti tablicu u HTML -u. To se radi pomoću oznake
| dodaje ćeliju u red. Ne zaboravite zatvoriti oznake. Na primjer, napravimo ovakvu tablicu:
Da bi okviri tablice bili vidljivi, oznaka
|
