Atribuut colspan on HTML-i funktsioon, mis võimaldab veebilehe tabelilahtril ulatuda üle mitme veeru. HTML on üks peamisi viise, kuidas veebilehti luuakse. Üks viis HTML-i veebilehele struktuuri toomiseks on tabeli kontseptsioon. Tabelis on mitu rida ja veergu. Teave tabeli üksikutes lahtrites kuvatakse vertikaalselt ja horisontaalselt organiseerituna.
Sageli soovitakse HTML-tabeli kuvamisel, et mõni teave rakendub või jaotatakse mitmesse veergu. Kui selline teave on piiratud ühe reaga, on atribuut colspan kasulik. Seetõttu näitab colspan=N, kus N on mingi arv, näiteks 2, 3 jne, et lahter levib või katab nii palju veerge.
Vaatleme näidet, kus müügiandmed kuvatakse tabelina kolme veeru pealkirjaga: müügipiirkond, piirkonna pealkiri ja müügisumma. Kui kuvatakse kogusumma, pakub huvi ainult müügisumma. Isikulahter on selles reas tühi. Tühja lahtri näitamise asemel on tore juhtida tähelepanu kogusummale. Selle saavutab järgmine kood.
Selles näites luuakse tabel ja määratakse kolm pealkirja — Piirkond, Müügijuht ja Müük —, millele järgneb kolm rida andmeid. Tabeli iga lahtrit tähistab „tabeliandmete” atribuut td. Neljandas reas on koos kogusummaga antud fraas Müük kokku. Pange tähele, et fraasi “Kogu müük” rõhutab selle lahter, mis hõlmab kahte veergu: veergu Piirkond ja veergu Pea; see saavutatakse määrates colspan=2. See lahter hõlmab kahte veergu, seega on sellel real ainult kaks td atribuuti, mitte kolm, nagu teistes ridades.
Selle koodi saab kopeerida tekstifaili ja kuvada selle efekti vaatamiseks brauseris. Veebileht ei pruugi sageli nõuda andmete kuvamist tabeli lahtrites, nagu ülaltoodud näites. Tabelikontseptsioon on aga väga kasulik veebilehel teabe korraldamiseks.
Veebileht koosneb sageli peal olevast päisest, näiteks ettevõtte nimest ja logost, ühest või mitmest menüüst ülal või kõrval, põhiteabest keskel ja kokkuvõtlikust teabest all. Selle saavutamiseks võib selle all kasutada tabelistruktuuri, ilma et lugeja sellest teadlik oleks. Üsna sageli levib osa teavet atribuudi colspan abil mitme veeru peale, mis ei lase veebilehel kohmakas välja näha.
Näiteks võite soovida isiklikku lehte, millel on kolm veergu: perekond, karjäär ja kogukond. Hea efekt oleks üksluised veerud fotoga katkestada kuskil lehe all, kus see levib üle kõikide veergude. Järgmine kood saavutab selle vahemiku väärtusega 3.