Scribd Logo
Upload

Welcome to Scribd!

  • Detaljni CSS Vodič Za Početnike

    Uploaded by

    Billy Carson Nik
    460 views10 pages

    Original Title

    Detaljni CSS vodič za početnike

    Copyright

    © Attribution Non-Commercial (BY-NC)

    Available Formats

    DOC, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document

    Copyright:

    Attribution Non-Commercial (BY-NC)
    Download as DOC, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    460 views10 pages

    Detaljni CSS Vodič Za Početnike

    Uploaded by

    Billy Carson Nik

    Copyright:

    Attribution Non-Commercial (BY-NC)
    Download as DOC, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    of 10

    Detaljni CSS vodič za početnike

    Piše Višnja Željeznjak

    1. Uvod
    2. Gdje pohraniti CSS specifikaciju?
    3. Selektori i njihovi trikovi
    4. CSS klase: najbolji način za definiranje stilova
    5. Korištenje <DIV> i <SPAN> tagova za umetanje CSS stilova
    6. Pomoću kojih vrijednosti možemo zadavati CSS stilove?
    7. Koje sve stilove imamo na raspolaganju?
    8. Box stilovi i rubovi (borders)
    9. Praktični primjeri: popularni CSS stilovi
    10. Alati za pisanje CSS stilova i korisni linkovi

    Ispiši vodič   |   Pošalji vodič na e-mail  |  Komentiraj

    Pretpostavljamo da već znate što je to CSS i koje su prednosti korištenja - vaš sljedeći logični korak je
    naučiti kako koristiti to čudo o kojem svi pričaju.

    Podsjetimo se: CSS nije ništa drugo nego skup pravila - stilova koja govore browseru kako prikazati
    određeni HTML tag. Idemo prvo pogledati kako izgleda to pravilo.

    Osnovna CSS sintaksa: selektor {stil: vrijednost }

    Svako CSS pravilo napisat ćete u sljedećem obliku (kôd se radi preglednosti obično piše u nekoliko
    linija):

    selektor {
    ime-stila1: vrijednost1;
    ime-stila2: vrijednost1 vrijednost2
    }

    Selektor definira kojem HTML tagu želite dodati CSS stil i u vitičastoj zagradi određujete kako će taj stil
    izgledati. Stil određujete tako da naznačite ime stila i dodijelite mu vrijednost (pogledajte sintaksu: stil i
    njegovu vrijednost odvajate dvotočkom).

    Ako definirate više stilova, odvajate ih točka-zarezom. Točka-zarez ne piše se iza posljednjeg navedenog
    stila.

    Jednom stilu možete dodijeliti više vrijednosti i tada ih samo navodite bez interpunkcija.

    Primjer:

    TABLE {
    background-color: white;
    border: 2px solid gray
    }

    Ovime smo kao selektor odabrali tag TABLE i odredili da će svaka tablica u našem dokumentu imati bijelu
    pozadinu i rub širine 2 piksela iscrtan punom crtom sive boje.

    Primijetite da su stilu border dodane tri vrijednosti koje smo odredili bez upotrebe interpunkcija.

    Ova osnovna sintaksa je vrlo jednostavna - zapamtite gdje idu zagrade, dvotočke i točke-zarezi i ne
    možete pogriješiti. S vremenom ćete naučiti i koje izraze koristiti kao ime-stila i vrijednost - postoji samo
    nekoliko desetaka mogućnosti koje se mogu pojaviti na tim mjestima.

    Postoje 3 načina da pohranite CSS pravila:


    1. izvan HTML dokumenta (external style sheets)

    Ljepota i snaga CSS-a leži upravo u mogućnosti da se svi stilovi koje ćete koristiti na cijelom
    siteu pohrane izvan HTML dokumenta. To nam omogućuje da promjenom stila na jednom
    jedinom mjestu promijenimo prikaz po cijelom siteu!

    Ovom metodom sve stilove spremamo u zaseban CSS dokument - običan file s .css
    ekstenzijom kojeg možete napisati u Notepadu i snimiti npr. u root direktorij u kojem se nalazi
    i vaš homepage. U njemu ćete definirati sva CSS pravila koja vam trebaju na siteu i nazvati file
    npr. mojsite.css.

    Eksterni .css file treba povezati s HTML dokumentom. To se radi uglavnom pomoću <LINK> taga
    u <HEAD> sekciji:

    <HEAD>
    <TITLE> Naslov stranice </TITLE>

    <LINK rel="stylesheet" type="text/css"


    href="http://www.webmajstori.net/stil.css">
    </HEAD>

    Postoji još jedna mogućnost pozivanja eksternih CSS dokumenata: pomoću @import funkcije
    koja se umeće slično kao i <LINK> tag. Međutim, tu funkciju slabo podržava Netscape i
    posljedice njenog korištenja su različite od korištenja <LINK> metode. Preporučujemo vam da
    zasad kao početnici zaboravite @import funkciju. Više o toj metodi možete saznati na službenoj
    W3C stranici sa CSS specifikacijom.

    Jednom kad povežete HTML dokument s .css fileom, stilovi definirani u njemu primjenjuju se na
    tagove pomoću class atributa - o tome ćemo nešto kasnije.

    2. unutar <HEAD> taga HTML dokumenta (embedded, document-level style sheets)

    CSS definiramo unutar specijalnog <STYLE> taga:

    <HEAD>
    <TITLE> Naslov stranice </TITLE>
    <STYLE type="text/css">
    P { font-size: large; color: red }
    </STYLE>
    </HEAD>

    Primijetite da unutar <STYLE> taga obavezno morate definirati tip stila: ovdje je to
    type="text/css".

    Ova metoda definiranja CSS stilova dobra je ako različitim HTML stranicama želite dodati
    različite stilove.

    3. unutar samog HTML taga (inline styles)

    Stilove možemo umetati u gotovo svaki HTML tag pomoću atributa style i direktnog
    specificiranja stila na sljedeći način:

    <P style="font-size: large; color: red">


    Neki tekst paragrafa prikazan
    velikim slovima i crvenom bojom
    </P>

    Pažnja! Nemojte pomiješati <STYLE> tag koji smo koristili u metodi pod 2) i style atribut koji
    koristimo ovdje. Radi se o dvije različite stvari (jedno je tag, a drugo atribut).
    Ova metoda je vrlo jednostavna, ali nije uvijek pogodna. Budući da ovako zadajete stil za svaki
    HTML tag posebno, cijeli dokument može postati vrlo kompliciran za održavanje. Ovakvim
    zadavanjem stilova gubite većinu prednosti zbog kojih se CSS koristi.

    Inline stilovi mogu biti korisni ako vam određeni stil treba samo na jednom jedinom mjestu i
    nigdje više - tada bi bilo glupo taj stil definirati globalno i nepotrebno povećavati veličinu CSS
    dokumenta.

    Inline stilovi imaju najviši prioritet od svih metoda za umetanje CSS stilova - specifikacija u
    inline stilu će pregaziti sve ostale CSS specifikacije. Upravo u tu svrhu se inline stilovi najčešće i
    koriste.

    Selektore ste susreli u prvom koraku ovog vodiča kad ste naučili kako korektno napisati CSS pravilo.
    Tada smo rekli da selektor nije ništa drugo nego određeni HTML tag kojeg navodite ispred vitičastih
    zagrada.

    Proširimo sad osnovnu sintaksu CSS-a!

    Nizanje selektora

    Jedan te isti stil možemo primijeniti na nekoliko selektora (HTML tagova) odjednom:

    H1, H2, H3 {
    color: blue; text-align: center
    }

    Svi naslovi sadržani u heading tagovima H1, H2 i H3 bit će plavi i centrirani. Svaki put kad isti skup
    stilova želite primijeniti na nekoliko različitih tagova, koristite nizanje selektora. Primijetite samo da kod
    nizanja selektore morate odvojiti zarezom.

    Kontekstualni selektori

    CSS vam omogućuje da određene stilove primijenite samo kad se neki HTML tag nalazi u određenom
    kontekstu, tj. u određenoj okolini. Zamislite da želite sadržaj u italic tagu <I> obojan zelenom bojom, ali
    samo u naslovima. Tada biste napisali sljedeći stil:

    H1 I { color: green }

    Svaki put kad browser naleti na italic tekst unutar H1 naslova, on će taj tekst prikazati zelenom bojom.
    Italic tekst u ostatku sadržaja neće biti zelen. Na ovaj način možete uvjetovati prikazivanje stilova.
    Zapamtite samo da u ovom slučaju ne smijete koristiti zareze jer će to browser protumačiti kao
    nizanje.

    Kontekstualne selektore možete kombinirati s nizanjem:

    H1 I, H2 I, H3 I {
    color: green; font-weight: bold
    }

    Svaki italic tekst unutar H1, H2 i H3 naslova bit će zelen i podebljan.

    Dosad smo CSS pravila pisali tako da smo selektirali neki HTML tag i odredili koje stilove će on poprimiti.
    Na taj način smo određeni skup stilova uvijek ograničavali na određene tagove. Međutim, CSS stilove
    možemo koristiti i univerzalno i tada koristimo klase.

    Klasa je skup CSS pravila koji se definira imenom klase. Da biste napisali CSS pravilo pomoću klasa, kao
    selektor ćete navesti ime klase koje sami zadajete i u vitičastim zagradama definirati stilove koje će ta
    klasa imati. Da biste vidjeli efekte koje ste u klasi definirali, ime klase trebate pozvati u HTML dokumentu
    pomoću class atributa.
    Generičke klase

    Generička klasa nije vezana za pojedini HTML tag i može se upotrebljavati na neograničenom broju
    lokacija unutar HTML dokumenta. Definiramo je proizvoljnim imenom kojemu prethodi točka:

    .zeleno { color: green }

    Generičku klasu pozivate pomoću class atributa:

    <A href="nekilink.htm" class="zeleno">


    Ovo je primjer linka </A>
    Napomena: ime klase možete pozvati i bez stavljanja u navodnike, međutim pravila dobrog pisanja
    HTML-a nalažu da se vrijednosti svih atributa pišu u navodnicima.

    Klase specifične za pojedine HTML tagove

    Određenu klasu možete vezati uz pojedini HTML tag. U tom slučaju ispred točke navodite tag na koji će
    se klasa primjenjivati:

    P.zeleno { color: green }

    Ovime ste definirali klasu zeleno i dodijelili klasu HTML tagu <P>. Svaki put kad želite neki paragraf
    obojati zeleno, trebat ćete unutar HTML dokumenta pozvati klasu na sljedeći način:

    <P class="zeleno">
    Zeleni tekst paragrafa <P>

    Pseudo-klase

    Pseudo-klase vam omogućuju da definirate izgled pojedinih HTML tagova u određenim stanjima. u
    CSS1 specifikaciji postoji samo 5 pseudo-klasa od kojih su najpoznatije one koje određuju izgled linkova,
    tj. izgled <A> taga.

    Pseudo-klase se (umjesto točkom) od HTML taga odvajaju dvotočkom.

    Pseudo-klase su zasad definirane samo za <A> i <P> tagove:

    A:link - određuje izgled HREF neposjećenog linka


    A:active - određuje izgled HREF aktivnog linka
    A:visited - određuje izgled HREF linka kojeg smo već posjetili

    P:first-line - kontrolira izgled prve linije paragrafa


    P:first-letter - kontrolira izgled prvog slova paragrafa

    Najkorištenije pseudo-klase su one za <A> tag. Tako možemo odrediti da link ne bude podcrtan i da
    bude crven:

    A:link {
    text-decoration: none; color: red
    }

    Korištenje ID oznaka kao klasa

    Kao klasu možete koristiti ID oznake, međutim postoji jedna velika razlika. Dok istu klasu možete
    koristiti na više mjesta i za više HTML tagova, ID oznake ne možete višestruko koristiti. One se koriste
    da bi se određenom elementu dodijelio specifičan stil koji neće imati nijedan drugi element u HTML
    dokumentu.

    Sintaksa je jednostavna. Na istom mjestu gdje biste inače definirali klasu, definirajte ID oznaku:
    #crno { color: black }

    ID oznaku pozivate pomoću ID atributa unutar raznih HTML tagova:

    <H3 id="crno">
    Ovo je naslov crne boje. </H1>

    Neki browseri će vam možda dozvoliti da ID oznaku koristite na više mjesta, ali to definitivno nije željeno
    ponašanje i bolje je da koristite klase.

    Napomenimo također da ne možete biti sigurni da će vam Internet Explorer uvijek dobro prikazati stilove
    određene pomoću ID oznaka jer je prikaz ID oznaka u IE bugovit.

    Ova dva HTML taga jesu odličan način da bilo kojem HTML elementu ili dijelu HTML koda dodate CSS stil.
    Do sad ste stilove primjenjivali na određenim HTML tagovima, no stil možemo primijeniti i na jedno
    jedino slovo teksta.

    <DIV> i <SPAN> koriste se da bismo određene HTML elemente grupirali zajedno i primijenili CSS stilove
    na njih. Razlika između ova dva taga je u tome što se <SPAN> koristi unutar teksta za primjenu stila na
    određena slova, dok <DIV> označava početak i kraj određene sekcije (division) dokumenta i uvijek
    umeće prekid unutar teksta, postavljajući sadržaj u novi red.

    Da bismo primijenili stilove na HTML elemente grupirane u <DIV> i <SPAN> tagove, koristimo class
    atribut unutar tih tagova:

    <P>
    SPAN tag možemo primijeniti
    <span class="zeleno"> unutar teksta </span>
    bez umetanja prekida.
    </P>

    To izgleda u browseru ovako:

    SPAN tag možemo primijeniti unutar teksta bez umetanja prekida.

    Pokušajte u istom ovom primjeru <SPAN> tag zamijeniti s <DIV> tagom i pratite što će se dogoditi.
    Generalno, text će u browseru biti prikazan s prekidom linije tamo gdje je umetnut <DIV> tag:

    DIV tag
    odvaja tekst
    od okolnog sadržaja.

    Stilovima dodjeljujemo vrijednost i za to imamo na raspolaganju 4 načina: numeričke vrijednosti, boju,


    URL i rezervirana imena.

    Numeričke vrijednosti

    Numeričke vrijednosti zadajemo pomoću brojeva koje kombiniramo s različitim mjernim jedinicama:

    pixel (px) - point (pt) - pica (pc) - Em (em) - Ex (ex) - Inches (in)
    millimeters (mm) - centimeters (cm) - percentage (%)

    Primjer:

    TABLE { border: 2px }

    Boja

    Boju zadajemo pomoću RGB vrijednosti (npr. #000000) ili navođenjem imena boje. Imena poput blue ili
    green dodijeljena su samo osnovnom setu od 16 boja.
    Primjer:

    TABLE {
    background-color: white
    }

    daje tablici bijelu pozadinu isto kao i

    TABLE {
    background-color: #FFFFFF
    }

    URL

    URL se zadaje drukčije nego u HTML standardu.

    Primjer:

    .pozadina {
    background-image: url(poz.gif)
    }

    URL se poziva navođenjem rezervirane riječi url i definiranjem putanje u okrugloj zagradi. Ne smijete
    ostaviti razmak između riječi url i otvorene zagrade.

    Putanja koji se definira u zagradi može biti apsolutna (u tom slučaju navodi se puna putanja zajedno s
    http://) ili relativna (s obzirom na URL definiranog CSS-a).

    Kad zadajemo putanju relativno, relativnost se odnosi na lokaciju datoteke u kojoj je definiran CSS stil.
    Ako stilove pohranite u vanjsku .css datoteku, putanja će biti relativna u odnosu na tu .css datoteku. Ako
    pak koristite embedded ili inline CSS stil, putanja je relativna u odnosu na HTML dokument u kojem je
    definiran CSS stil.

    Rezervirana imena

    Često se vrijednosti stilova zadaju imenima koja su predefinirana u CSS standardu. Neka od tih imena su
    imena boja koja smo već spomenuli.

    Rezervirana imena koja ćete često koristiti su npr. imena za veličinu teksta (large, medium, small),
    imena raznih efekata (dotted, underline, bold) itd.

    Postoji nekoliko desetaka različitih stilova koji kontroliraju prikaz vašeg HTML dokumenta. Sve stilove
    grupiramo prema tome kakav prikaz kontroliraju:

     fontovi, tekst i boje


     pozadina
     box i stilovi rubova (borders)
     liste
     pozicioniranje

    Fontovi, tekst i boje

    Nećemo ulaziti u popisivanje svih mogućih stilova koji postoje, nego ćemo samo navesti što sve u ovoj
    kategoriji možete kontrolirati pomoću CSS-a.

    Sve na što ste navikli u HTML <FONT> tagu nalazi se i ovdje: određivanje fonta (Arial, Verdana...), zatim
    efekti poput podebljanog ili kurzivnog teksta, veličina, boja.
    Tekst se može uljepšati nekim novim efektima kao što je visina reda teksta, razmak između slova, riječi i
    redova, poravnavanje i uvlačenje teksta, te efekti poput podcrtavanja, precrtavanja itd.

    Primjer definiranja stila teksta unutar jednog taga:

    P.sirokitext {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: x-small;
    font-weight: bold;
    color: #000000;
    letter-spacing: 4px
    }

    Pozadina

    Umjesto da izgled pozadine eksplicitno određujete u <BODY> tagu kao do sada, primijenite CSS! Možete
    odrediti boju, pozadinsku sliku, način prikaza pozadine (fiksirana ili pokretna slika, ponavljanje samo po
    x- ili y-osi) te čak poziciju pozadine.

    Primjer klase koja definira sliku kao fiksiranu pozadinu:

    .pozadina {
    background-image: url(poz.gif);
    background-repeat: no-repeat;
    background-attachment: fixed
    }

    Ovako definiranu klasu jednostavno pozovite iz <BODY> taga li nekog drugog taga:

    <BODY class="pozadina">
    ...
    </BODY>

    Liste

    Liste su u CSS-u dobile nove efekte, poput mogućnosti određivanja neke gif sličice koja će se prikazivati
    umjesto bulleta.

    Primjer liste koja umjesto kao bullet koristi neku sliku:

    UL {
    list-style-image: url(bullet1.gif)
    }

    Pozicioniranje

    Ova sposobnost CSS-a nije dovoljno iskorištena zbog loše implementacije u browserima. CSS će se
    jednog dana koristiti za pozicioniranje HTML elemenata u trodimenzionalnom prostoru.

    Zasad ćemo samo spomenuti da se pozicioniranje dosta koristi u izradi DHTML efekata i bit će najbolje da
    ovu kompleksnu temu obradimo jednom kad budemo pričali o DHTML-u.

    Ako se želite detaljnije upoznati sa CSS pozicioniranjem, skočite do zadnjeg koraka ovog vodiča i
    pogledajte koje vam linkove preporučujemo.

    Tematika box stilova je malo složenija pa ćemo je obraditi posebno.

    Box stilovi omogućuju sasvim nove efekte. Da biste ih razumjeli, potrebno je znati da CSS svaki element
    HTML stranice tretira kao da je oko njega opisan pravokutnik (box). Pogledajmo to zajedno na slici:
    Svaki od ovih svojstava: width, border, padding i margin mogu se zasebno
    kontrolirati.

    Padding je razmak između elementa i ruba (bordera).

    Margin je vrijednost koja određuje razmak između elemenata u HTML


    dokumentu. Kad nekom elementu odredite marginu, vi zapravo povećavate
    prostor koji taj element zauzima i dodajete mu nevidljivi rub (na slici je taj nevidljivi rub izražen većim
    iscrtkanim pravokutnikom).

    Ako su vrijednosti margine i paddinga na nuli, element zauzima samo prostor određen njegovom
    vlastitom širinom (element width). Povećavate li njihove vrijednosti, element zauzima sve više i više
    mjesta.

    Za svaki element može se definirati pozadina i svi stilovi pozadine - naglasimo samo da će se pozadina
    prostirati na prostoru kojeg odredite s vrijednošću za padding.

    Rubovi (borders)

    Do sada smo u standardnom HTML-u kod rubova (borders) mogli odrediti samo širinu i boju. CSS nam
    omogućuje da svaki rub (lijevo, desno, gore i dolje) ima vlastita svojstva poput boje, širine i efekta.
    Posebno su zanimljivi efekti rubova: osim pune crte, sad možemo imati točkasti, isprekidani, dvostruki
    rub, te još neke zgodne efekte.

    Primjer dodavanja zelene pozadine, iscrtkanog ruba i paddinga tekstu:

    .txtpozadina {
    background-color: green;
    padding: 5px;
    border: 2px dashed
    }

    Primijenimo li ovaj stil na tekst "Obojano!", dobivamo:

    Obojano

    Primijetite da je zbog vrijednosti stila padding prostor koji zauzima pozadina proširen za 5 piksela ispod,
    iznad, lijevo i desno od riječi "Obojano".

    Nepodcrtani link

    Sljedeći stil redefinira <A> tag:

    A { text-decoration: none }

    Efekt kod prelaska mišem preko linka

    Želite li da vam link dobije npr. podcrtu i postane zelen, koristite pseudo-klasu:

    A:hover {
    text-decoration: underline;
    color: green
    }

    Hover pseudo-klasa je dio CSS2 specifikacije i nije podržana u Netscape 4.x browserima.

    Tekst s obojanom pozadinom


    Recimo da želite određenom tekstu dati zelenu pozadinu i proširiti tu pozadinu za 5 pixela. Kreirat ćete
    neku klasu (ovdje je to klasa s imenom .txtpozadina) i pomoću <SPAN> taga primijeniti taj stil na
    određeni tekst:

    .txtpozadina {
    background-color: green;
    padding: 5px;
    }

    Tekst sa zelenom pozadinom širokom 5 pixela!

    Evo kako ubaciti ovaj predefinirani stil u HTML:

    <SPAN class="txtpozadina">
    Tekst sa zelenom pozadinom širokom 5 pixela!
    </SPAN>

    Promijenite izgled kursora / mouse pointera!

    Ovaj stil ne spada u CSS1, već u CSS2 specifikaciju, što znači da promjena kursora možda neće biti
    vidljiva u starijim browserima.

    Bez obzira želite li redefinirati izgled kursora u cijelom dokumentu ili na nekom dijelu dokumenta (npr.
    samo kad se miš nalazi iznad tablica), ubacite u svoju CSS klasu npr. sljedeći stil:

    cursor: crosshair

    Ovo će kursor promijeniti u križić.

    Pogledajmo to na gornjem primjeru gdje smo tekstu dodali zelenu pozadinu i proširili pozadinu za 5
    piksela. Idemo odrediti da mouse pointer postane križić kad prijeđemo mišem preko tog teksta sa
    zelenom pozadinom! Samo ćemo u postojeću klasu ubaciti definiciju kursora:

    .txtpozadina {
    background-color: green;
    padding: 5px;
    cursor: crosshair
    }

    Isprobajte to na donjem tekstu:

     Tekst sa zelenom pozadinom širine 5 pixela!

    Stil cursor ima nekoliko mogućih vrijednosti, a zanimljive su:

    hand
    wait (pointer se pretvara u pješčani sat)
    help (kraj pointera se pojavljuje upitnik)

    Notepad

    Nećete vjerovati, ali za pisanje i najkompliciranijeg CSS stila bit će vam dovoljan Notepad. Iako se ne
    radi o najelegantnijem rješenju jer ipak morate sve ručno upisivati, korištenje Notepada će vas najbolje
    naučiti kako pravilno pisati CSS kod.

    Dreamweaver kao predstavnik vizualnih HTML editora

    Dreamweaver ima solidno i vrlo jednostavno sučelje za izradu CSS stilova. Stilovi su vam već navedeni i
    vi samo morate odrediti njihovu vrijednost odabirom iz padajućih menija. Umetanje CSS klasa je također
    vrlo jednostavno i izvodi se s dva-tri klika mišem.
    Nedostatak Dreamweavera (kao i svih ostalih vizualnih web editora) jest taj što CSS kod neće biti tako
    čitljiv kao da ste ga ručno napisali u Notepadu. Cijeli kod bit će dosta zgusnut. Također, Dreamweaver
    nije savršen i ako puno prčkate po CSS kodu pomoću Dreamweavera, moguće je da će krajnji rezultat
    biti nepravilan kod i da ćete ga ručno morati ispravljati.

    CSS editori

    Postoji nekoliko alata koji su namijenjeni isključivo pisanju CSS-a. Jedan od boljih je i TopStyle koji
    doduše nije besplatan, ali je po riječima iz CNet-a vrijedan svoje cijene. Ima sve napredne opcije koje
    imaju moderni editori i još puno više.

    Mi smo imali prilike isprobati besplatni alat pod imenom StyleWorx koji je sasvim zadovoljavajući za
    početnike: ima syntax highlighting, podršku za CSS1 i CSS2 stilove i dosta je konfigurabilan.

    Korisni linkovi za proširivanje znanja o CSS-u

    Službena CSS1 specifikacija nalazi se na stranici organizacije koja je CSS izradila i standardizirala - CSS1
    specifikacija na stranicama W3C-a.

    Odličnu školu CSS-a s kompletnim objašnjenjem svakog pojedinog stila, referencom, brdom primjera i
    kvizevima naći ćete na W3Schools školi CSS-a. Tamo žete naći i CSS2 specifikaciju u kojoj su primjeri
    novih, do sad malo korištenih stilova.

    CSS guru Eric Meyer izradio je tablicu podrške CSS-a u raznim browserima. Ako želite biti sigurni da će
    vaš CSS stil biti vidljiv u svim browserima, obavezno provjerite ovu tablicu!

    You might also like