U -{HTML}-, span i div elementi se koriste za definisanje delova dokumenta tako da se mogu identifikovati kada drugi -{HTML}- elementi nisu pogodni. Gde ostali -{HTML}- elementi kao što su p (), em () i tako dalje tačno predstavljaju semantiku sadržaja, -{span}- i -{div}- elementi vode do bolje čitljivnosti i lakšeg održavanja sadržaja .Kada nijedan drugi -{HTML}- element nije primenljiv, span i div se mogu koristiti kao deo dokumenta na koji se mogu primeniti drugi -{HTML}- atributi kao na primer class, id, lang ili dir.
span predstavlja linijski deo dokumenta, na primer reči u rečenici. div predstavlja deo dokumenta u vidu bloka kao na primer više paragrafa ili sliku sa naslovom. Nijedan element nema samostalno nema smisla, ali ovi elementi dozvoljavaju semantičke atribude (npr. lang="en-US"), -{CSS}- stilove (npr. boje, tipografiju) ili skriptovanje od strane klijenta ().
Istorija span element je predstavljen 1995. godine. Ipak, sve do -{HTML}- 4.01 nije postao deo -{HTML}- jezika. Pojavio se u -{HTML}- 4 1997. godine.
Razlike i podrazumevana ponašanja Postoje mnoge razlike između div i span. Najveća primetljiva razlika je u načinu prikazivanja elemenata. U standardnom -{HTML}-, div je element nivoa bloka, dok je span linijski element. div vizuelno izoluje sekciju dokumenta na stranici, i ne može sadržati druge blokovske elemente. span element sadrži deo informacije iz jedne linije. U praksi se standardni način prikazivanja elemenata semože promeniti korišćenjem -{CSS}-, ipak korišćenjem -{CSS}- se ne mogu promeniti dozvoljeni sadržaji elemenata. Na primer, span ne može sadržati elemente nivoa bloka kao svoju decu.
Praktična primena span i div elementi se koriste za logičko grupisanje elemenata.
Postoje tri razloga za korišćenje span i div tagova sa class ili id atributima:
Stiling sa -{CSS}--om
Uobičajeno je da i elementi nose class ili id atribute u saradnji sa -{CSS}--om za generisanje izgleda, tipografije, boja i ostalih prezentacionih atributa.
Semantička jasnoća Ovaj način grupisanja i označavanja delova stranice može biti uveden čisto da bi semantika bila jasnija u generalnim crtama.
Pristup iz koda Kada se -{HTML}- ili -{XHTML}- dostavi klijentovom veb brauzeru, postoji šansa da će klijentov kod morati da se kreće kroz unutrašnju strukturu veb stranice. To se događa zato što se stranica često isporučuje client-side JavaScript koja izaziva dinamičko ponašanje stranice.
Prekomerno korišćenje Korišćenje div i span je vitalan deo -{HTML}- i -{XHTML}- koda. Međutim, ponekad ih je moguće prekomerno koristiti.
Na primer ovaj kod: <ul class="menu"> <li>Main page</li> <li>Contents</li> <li>Help</li> </ul>
... je poželjniji od sledećeg koda: <div class="menu"> <span>Main page</span> <span>Contents</span> <span>Help</span> </div>
Vidi još HTML HTML element HTML attribute Cascading Style Sheets CDATA JavaScript Semantic Web
Spoljašnje veze Grouping elements: the DIV and SPAN elements Create Horizontal and Vertical Aligned DIV
Категорија:HTML