Овај водич показује шта је атрибут „ровспан“ и како га користити са елементом „тд“.
Шта је атрибут „распон редова“?
Атрибут „ровспан“ се користи за спајање више ћелија у вертикалном правцу. Може се приступити као „ распон редова = вредност ', где ' вредност ” је број редова који треба да се споје у вертикалном правцу. Корисно је за побољшање читљивости корисника и приказивање сложених података на начин који је кориснику привлачнији.
Шта је 'тд' елемент?
„ тд ” или елемент података табеле се користи за дефинисање ћелије унутар ХТМЛ табеле. Углавном се користи у комбинацији са другим елементима ХТМЛ табеле као што су „<тр>”, „<тх>”, „<табле> за креирање садржаја табеле. Такође се може користити са атрибутима као што су „цолспан“ и „ровспан“ за додавање додатних карактеристика дизајна, смањење сложености и побољшање фактора читљивости, итд. Користи се у ХТМЛ датотеци користећи „ <тд> ” ознака.
Како користити атрибут „ровспан“ са елементом „тд“?
За бољу демонстрацију односа између атрибута „ровспан“ и „тд“ елемента. Хајде да прођемо кроз практичан пример пратећи доњи водич корак по корак:
Корак 1: Креирање табеле у ХТМЛ-у
Прво направите табелу уз помоћ „ <табле> ” ознака. Унутар њега додајте више „ <тр> ” ознаке које убацују редове у табелу и користе „ <тд> ” ознака за креирање ћелија:
< стил >
сто{
бордер-цоллапсе:цоллапсе;
маргина: 40пк;
}
тх,тд{
граница:2пк пуна црвена;
паддинг: 20пк;
}
< / стил >
< / глава >
< тело >
< сто >
< тр >
< тх > емп.ид < / тх >
< тх > име запосленог < / тх >
< тх > Плата < / тх >
< / тр >
< тр >
< тд > 1 < / тд >
< тд > Јохн < / тд >
< тд > 160.000 < / тд >
< / тр >
< тр >
< тд > 2 < / тд >
< тд > Јосепх < / тд >
< тд > 120.000 < / тд >
< / тр >
< тр >
< тд > 3 < / тд >
< тд > Ангела < / тд >
< тд > 120.000 < / тд >
< / тр >
< тр >
< тд > 4 < / тд >
< тд > Сцарлет < / тд >
< тд > 80.000 < / тд >
< / тр >
< / сто >
< / тело >
У горњем исечку кода:
- Прво, креирано је пет редова и свакој ћелији су дати неки лажни подаци.
- Затим, „ сто ” елемент се бира и поставља „ колапс ” вредност за ЦСС “ граница-урушавање ' имовина.
- Након тога, „ граница ' и ' паддинг ” својства се користе за побољшање видљивости корисника и стварање ефекта привлачног за корисника.
Након извршења кода, табела изгледа овако:
Горњи излаз показује да је табела креирана и стилизована.
Корак 2: Коришћење атрибута „ровспан“ са елементом „тд“.
„ распон редова ” атрибут спаја суседне ћелије у вертикалном правцу. Користи се са „ <тд> ” елемент/ознака. Атрибут узима број као вредност и говори колико ћелија се спаја у вертикалном правцу. Предстојећа суседна ћелија мора да има једну ћелију мање у количини, а тај простор се попуњава атрибутом „простор редова“ као што је приказано у наставку:
< тело >< сто >
< тр >
< тх >Емп.ид< / тх >
< тх >Име запосленог< / тх >
< тх >Плата< / тх >
< / тр >
< тр >
< тд > 1 < / тд >
< тд >Јован< / тд >
< тд > 160 ,000< / тд >
< / тр >
< тр >
< тд > 2 < / тд >
< тд >Јосепх< / тд >
< тд распон редова = '2' > 120 ,000< / тд >
< / тр >
< тр >
< тд > 3 < / тд >
< тд >Анђела< / тд >
< / тр >
< тр >
< тд > 4 < / тд >
< тд >Сцарлет< / тд >
< тд > 80 ,000< / тд >
< / тр >
< / сто >
< / тело >
У горњем коду:
- „Распон редова“ је приложен уз запосленог који има „ Плата ” тд елемент.
- Вредност ' 2 ” се пружа атрибуту „ровспан” који поставља исте податке у обе суседне ћелије као што је приказано у наставку:
Излаз илуструје да су две ћелије спојене и да је читљивост за корисника сада побољшана.
Закључак
„ распон редова ” атрибут ради са „ тд ” за спајање више суседних ћелија у вертикалном правцу. Атрибут узима број као вредност и говори колико ће ћелија бити спојено. Користи се када се исти подаци дају у више ћелија. Овај блог је показао шта је „ровспан“ и како га користити са елементом „тд“ у ХТМЛ-у.