Što je atribut 'rowspan' i kako se koristi s elementom 'td' u HTML-u?

U HTML-u, ' raspon redova ” je atribut koji se može koristiti pri izradi tablica. Obično se koristi za spajanje više susjednih ćelija u okomitom smjeru. Može se koristiti za izradu složenih dizajna stolova uz dodavanje vizualnog interesa za korisnika. Koristeći ga, programer može smanjiti HTML kod i poboljšati čitljivost tablice. Štoviše, atribut 'rowspan' može pomoći organizirati tablicu grupiranjem više ćelija.

Ovaj vodič pokazuje što je atribut 'rowspan' i kako ga koristiti s elementom 'td'.

Što je atribut 'rowspan'?

Atribut 'rowspan' koristi se za spajanje više ćelija u okomitom smjeru. Može mu se pristupiti kao ' raspon redaka = vrijednost ', gdje je ' vrijednost ” je broj redaka koje je potrebno spojiti u okomitom smjeru. Korisno je za poboljšanje korisničke čitljivosti i prikazivanje složenih podataka na korisniku privlačniji način.

Što je 'td' element?

' td ” ili podatkovni element tablice koristi se za definiranje ćelije unutar HTML tablice. Uglavnom se koristi u kombinaciji s drugim HTML elementima tablice kao što su “”, “”, “

za stvaranje sadržaja tablice. Također se može koristiti s atributima kao što su 'colspan' i 'rowspan' za dodavanje dodatnih značajki dizajna, smanjenje složenosti i poboljšanje faktora čitljivosti, itd. Koristi se u HTML datoteci pomoću ' ' oznake koje umeću retke u tablicu i koriste '

” oznaka.

Kako koristiti atribut 'rowspan' s elementom 'td'?

Za bolju demonstraciju odnosa između atributa “rowspan” i elementa “td”. Prođimo kroz praktičan primjer slijedeći donji vodič korak po korak:

Korak 1: Izrada tablice u HTML-u

Najprije izradite tablicu uz pomoć ' ” oznaka. Unutar njega dodajte više '

” za stvaranje ćelija:

< stil >

stol{

granični kolaps: kolaps;

margina: 40px;

}

th,td{

rub:2px puna crvena;

ispuna: 20px;

}

< / stil >

< / glava >

< tijelo >

< stol >

< tr >

< th > emp.id < / th >

< th > ime zaposlenika < / th >

< th > Plaća < / th >

< / tr >

< tr >

< td > 1 < / td >

< td > Ivan < / td >

< td > 160.000 < / td >

< / tr >

< tr >

< td > 2 < / td >

< td > Josipa < / td >

< td > 120.000 < / td >

< / tr >

< tr >

< td > 3 < / td >

< td > Angela < / td >

< td > 120.000 < / td >

< / tr >

< tr >

< td > 4 < / td >

< td > Grimizna < / td >

< td > 80.000 < / td >

< / tr >

< / stol >

< / tijelo >

U gornjem isječku koda:

Prvo je stvoreno pet redaka, a svakoj ćeliji dostavljeni su neki lažni podaci.
Zatim, ' stol ' odabran je element i postavite ' kolaps 'vrijednost za CSS' granica-kolaps ” vlasništvo.
Nakon toga, ' granica ' i ' podstava ” svojstva se koriste za poboljšanje vidljivosti korisnika i stvaranje privlačnog učinka za korisnika.

Nakon izvršenja koda, tablica izgleda ovako:

Gornji izlaz prikazuje da je tablica stvorena i stilizirana.

Korak 2: Korištenje atributa 'rowspan' s elementom 'td'.

' raspon redova ” atribut spaja susjedne ćelije u okomitom smjeru. Koristi se s '

” element/oznaka. Atribut uzima broj kao vrijednost i govori koliko će se ćelija spojiti u okomitom smjeru. Nadolazeća susjedna ćelija mora imati jednu ćeliju manje u količini, a taj se prostor popunjava atributom 'rowspan' kao što je prikazano u nastavku:

< tijelo >

< stol >

< tr >

< th >Emp.id< / th >

< th >Ime zaposlenika< / th >

< th >Plaća< / th >

< / tr >

< tr >

< td > 1 < / td >

< td >Ivan< / td >

< td > 160 ,000< / td >

< / tr >

< tr >

< td > 2 < / td >

< td >Josip< / td >

< td raspon redova = '2' > 120 ,000< / td >

< / tr >

< tr >

< td > 3 < / td >

< td >Anđela< / td >

< / tr >

< tr >

< td > 4 < / td >

< td >Grimizna< / td >

< td > 80 ,000< / td >

< / tr >

< / stol >

< / tijelo >

U gornjem kodu:

'Raspon redaka' priložen je uz zaposlenika koji ima ' Plaća ” td element.
Vrijednost ' 2 ” pruža se atributu “rowspan” koji postavlja iste podatke u obje susjedne ćelije kao što je prikazano u nastavku:

Izlaz ilustrira da su dvije ćelije spojene i da je čitljivost za korisnika sada poboljšana.

Zaključak

' raspon redova ' atribut radi s ' td ” za spajanje više susjednih ćelija u okomitom smjeru. Atribut uzima broj kao vrijednost i govori koliko će se ćelija spojiti. Koristi se kada se isti podaci daju u više ćelija. Ovaj blog je pokazao što je 'rowspan' i kako ga koristiti s 'td' elementom u HTML-u.

Što je atribut 'rowspan' i kako se koristi s elementom 'td' u HTML-u?