Den här guiden visar vad som är attributet 'rowspan' och hur man använder det med elementet 'td'.
Vad är ett 'rowspan'-attribut?
Attributet 'rowspan' används för att slå samman flera celler i vertikal riktning. Den kan nås som ' radspan = värde ', där den ' värde ” är antalet rader som behöver slås samman i vertikal riktning. Det är fördelaktigt för att förbättra användarens läsbarhet och visa komplexa data på ett mer tilltalande sätt.
Vad är ett 'td' element?
den ' td ” eller tabelldataelement används för att definiera en cell i en HTML-tabell. Det används mest i kombination med andra HTML-element i tabeller som '
Hur använder man 'rowspan'-attributet med 'td'-elementet?
För en bättre demonstration av sambandet mellan 'rowspan'-attributet och 'td'-elementet. Låt oss gå igenom ett praktiskt exempel genom att följa nedanstående steg-för-steg-guide:
Steg 1: Skapa en tabell i HTML
Skapa först en tabell med hjälp av ' I kodavsnittet ovan: Efter exekvering av koden ser tabellen ut så här: Ovanstående utdata visar att tabellen är skapad och formaterad. den ' radspann ”-attribut slår samman angränsande celler i vertikal riktning. Den används med ' I ovanstående kod: Utdata illustrerar att de två cellerna är sammanslagna och läsbarheten för användaren är nu förbättrad. den ' radspann '-attributet fungerar med ' td ” för att slå samman flera intilliggande celler i vertikal riktning. Attributet tar ett tal som ett värde och talar om hur många celler som slås samman. Det används där samma data tillhandahålls till flera celler. Den här bloggen har visat vad 'rowspan' är och hur man använder det med elementet 'td' i HTML. '-taggar som infogar raderna i tabellen och använder ' '-tagg för att skapa celler:
< stil >
tabell{
border-collapse:kollaps;
marginal: 40px;
}
th,td{
border:2px fast röd;
stoppning: 20px;
}
< / stil >
< / huvud >
< kropp >
< tabell >
< tr >
< th > emp.id < / th >
< th > Anställd Namn < / th >
< th > Lön < / th >
< / tr >
< tr >
< td > 1 < / td >
< td > John < / td >
< td > 160 000 < / td >
< / tr >
< tr >
< td > 2 < / td >
< td > Josef < / td >
< td > 120 000 < / td >
< / tr >
< tr >
< td > 3 < / td >
< td > Angela < / td >
< td > 120 000 < / td >
< / tr >
< tr >
< td > 4 < / td >
< td > Scharlakansrött < / td >
< td > 80 000 < / td >
< / tr >
< / tabell >
< / kropp >
Steg 2: Använd attributet 'rowspan' med elementet 'td'.
” element/tagg. Attributet tar ett tal som ett värde och talar om hur många celler som slås samman i vertikal riktning. Den kommande intilliggande cellen måste ha en cell mindre i kvantitet, och det utrymmet fylls av 'rowspan'-attributet som visas nedan: < kropp >
< tabell >
< tr >
< th >Emp.id< / th >
< th >Anställds namn< / th >
< th >Lön< / th >
< / tr >
< tr >
< td > 1 < / td >
< td >John< / td >
< td > 160 000< / td >
< / tr >
< tr >
< td > 2 < / td >
< td >Josef< / td >
< td radspann = '2' > 120 000< / td >
< / tr >
< tr >
< td > 3 < / td >
< td >Angela< / td >
< / tr >
< tr >
< td > 4 < / td >
< td >Scarlet< / td >
< td > 80 000< / td >
< / tr >
< / tabell >
< / kropp >
Slutsats