KAJ SO SLOGOVNE PREDLOGE

Slogovna predloga (ang. Cascading Style Sheets - CSS) je mehanizem, ki pove spletnemu brskalniku kako naj prikaže HTML dokument. CSS struktuira vsebino HTML dokumenta in ji da želeno obliko.

Zakaj?

V prazgodovini spleta se je z večino značk, besedilo in druge elemente dokumenta HTML oblikovalo logično. Določilo se je, kaj določen del predstavlja (slika, tabela, vrstica v tabeli, polje v tabeli, seznam, točka seznama, odstavek, črta, indeks, eksponent, naslov, aktivna povezava ...), nič pa se ni ukvarjalo z obliko teh elementov. Puslogi smo, naj jih brskalnik oblikoval po svoje.

Če ste pred nekaj leti izdelovali spletne strani, ste uporabljali značke <font> in druge, da ste lahko oblikovali spletne strani. Te so vam omogočile, da so dokumenti izgledali tako, kot ste si želeli. Če pa ste se kasneje odločili zamenjati izgled vseh strani v spletišču (četudi samo barvo ozadja), ste morali popraviti vsako stran posebej.

Slogovne predloge predstavljajo rešitev tega problema. Kadar določite slogovno predlogo in jo povežete z vsemi stranmi v spletišču, imate lahek nadzor nad celotnim spletiščem. Če želite spremeniti izgled, je potrebno spremeniti samo datoteko s slogovno predlogo.

Z uporabo slogov lahko določamo, kako naj pregledovalnik oblikuje posamezne elemente našega dokumenta. Določiti je mogoče celo vrsto oblikovnih lastnosti, med katere spadajo ozadje, robovi, razmiki, odmiki, pisava, poravnava, barva ...

Kako izgleda slogovna predloga?

Slogovna predloga je narejena iz niza pravil, ki izgledajo približno takole:

h2
{
    font-family: Arial;
    font-style: italic;
    color: green
}

vsako pravilo se prične s selektorjem (v zgornjem primeru h2). Selektor je običajno ena ali več elementov (značk) v dokumentu HTML, deklaracije znotraj zavitih oklepajev pa določajo kako bodo ti elementi prikazani. Najprej je napisana lastnost (npr. font-style ), nato dvopičje, za njim pa vrednost (npr. italic ). V primeru, da je napisanih več pravil, jih je potrebno med seboj ločiti s podpičji.

V zgornjem primeru font-style: italic določa poševno besedilo (nekoč značka <i> v HTML), font-family: Arial vrsto pisave in color: green zeleno barvo pisave.

Kako bo izgledala stran s slogovnimi predlogami?

Dandanes si ne bi smeli delati problemov ali brskalniki podpirajo slogovne predloge ali ne. Prva priporočila za CSS je W3C izdal že davnega leta 1996. Prvi jih je podprl Internet Explorer, nato Opera, Netscape se je izogibal CSS in hotel uveljaviti svoje JSS.

Danes vsi brskalniki podpirajo CSS. CSS Level 1 je uveljavljen v vseh. Vseh pravil CSS Level 2 pa še ni uspel vključiti noben brskalnik. Vsi brskalniki (z izjemo Opere) pa so dodali svoja pravila. Kot je običajno pa se v vseh brskalnikih pojavljajo napake in brskalniki posameznih pravil ne tolmačijo pravilno. To predstavlja velik problem za spletne oblikovalce. Nekateri oblikovalci uporabljajo JavaScript, da prilagodijo strani posameznemu brskalniku in različici in tako izkoristijo prednosti posameznih brskalnikov. Vendar pa je običajno boljši konservativnejši pristop. Pazljivo se izdela predloga strani in se preskusi v vseh brskalnikih. V kolikor kateri brskalnik kakšnega pravila ne podpira, ga pri oblikovanju strani ne uporabimo.

 Gor     e-gradiva     CSS     primeri     Zakaj CSS

SERŠ Maribor : Strokovna gimnazija : 2002 : Niko Fajfar