•UVOD U HTML & CSS II
-Evo nas u drugom dijelu tutorijala vezanih za HTML & CSS. Kao što sam već i rekao u prvom dijelu danas radimo CSS, a zatim u sljedećem tutorijalu trebali bi smo krenuti sa primjenom HTML-a i CSS-a za kreiranje neke Web prezentacije.
-Elem, da vidimo šta ćemo danas raditi? Znači počet ćemo sa nekim osnovama ali sada CSS-a, ovaj tutorial će biti dosta sličan onom prvom barem što se tiče tipa sadržaja. Pa počnimo!
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
•POZIVANJE CSS-a
-Pošto ćemo mi raditi odvojeno, znači odvojeni fajlovi .html i .css, trebamo nešto uraditi da bi zapravio .html fajl znao odakle da uzima "stil". Prvo što trebano jeste napraviti novi fajl koji će nositi naziv style.css ili kako god želite bitno je da je nastavak .css. CSS pozivamo na slijedeći način:
-Da i ovo kažem a mislim da sam rekao u prvoj lekciji. Ovaj tag se upisuje između <head> tagova, a u prvom dijelu rekao sam šta sve tu ide.
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
• CSS PRAVILA
-Naravno kao i svi drugi programski jezici, tako i CSS ima neka svoja pravila, nećemo tek tako kucati neki text da bi dobili stil naše stranice, naravno.
Prvo što ćemo unijeti u naš dokument jeste pozadina a to radimo na slijedeći način:
-Spremite i otvorite vaš index.html šta ste dobili? Vidimo da se pozadina stranice promjenila u crnu boju, zato jer smo rekli CSS-u slijedeće:
body elementu daj svojstvo "pozadinu" koja se u CSSu piše eng.riječi background i to stavili smo njenu vrijednost na #000 a to je hexadecimalna vrijednost za crnu boju.
Na ovoj slici je detaljno pojašnjena ova sintaxa:
Kada imamo više svojstava evo kako ih zapisujemo.
-Sva svojstva se pisu engleskim riječima, a i u vašem editoru čim otvorite vitičastu zagradu odma će vam izlistati sva moguća svojstva =)
-Hexadecimalne vrijednosti možete naći u Photoshopu, a ako koristite Dreamweaver sam će vam izbaciti paletu boja, vaše je samo da odaberete.
-Znači ovo iznad smo sve mogli napisati u jednom redu, bitno je da se odvajaju tačka-zarezom ";", ali zbog preglednosti preporučujem vam da pišete jedno ispod drugog, a i lakše ćete se snalaziti.
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
• CSS KOMENTARI
-Sa kometarima smo se upoznali u HTML-u i vidjeli za šta služe ovdje ćemo samo ispisati kako se oni u CSS-u pišu.
/* OVO JE KOMENTAR U CSS-u*/
-Znači sastoji se od kose crte i zvjezdice, vašeg texta i onda napišemo zvjezdicu pa opet kosu crtu(slash).
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
• HTML & CSS II Prvi Dio KRAJ!
-I to bi bilo sve za ovaj prvi dio CSS-a. Pošto sam se potrudio da ovo malo ljepše izgleda od prvog tuta, na tome sam izgubio vrijeme, pa ove slike sam ručno radio, tako da je ovo dovoljno za danas. Sutra ćemo nešto više govoriti o svojstvima, njihovim mogućnostima, uređivanje divova i za šta oni zapravo služe, i to će biti sve za ovaj "Textualni" dio tutorijala. Već tamo početkom sedmice Ponedjeljak/Utorak trebao bi da bude prvi .PSD u .HTML TUTORIAL i to u video formatu, kada ću moći puno detaljnije da objasnim neke stvari a i da vidite gdje se prave česte greške i kako ih izbjegavati.
-Nadam se da vam se sviđaju ovi TUTORIJALI, naravno komentarišite, postavljajte pitanja i sve šta god vas zanima ili ako imate problem pitajte slobodno!
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Do Sutra veliki pozdrav, Ćao!
Puno mi je pomoglo !