Kako urediti stilove u CSS izgledu u Dreamweaveru

Nakon što izradite novu stranicu s CSS izgledom u Dreamweaveru, imate naizgled beskonačan broj opcija za uređivanje, ali prvo morate odrediti koji stilovi u stilskoj tablici odgovaraju elementima koje želite urediti.

Kao što vjerojatno možete zamisliti, stilove u CSS izgledu možete uređivati ​​na mnogo načina kako biste stvorili vlastite dizajne.

Nakon što prilagodite postojeće stilove kako biste dobili osnovni dizajn stranice kakav želite, možete stvoriti onoliko dodatnih stilova koliko želite.

Kako provjeriti dostupne stilove i napraviti osnovne izmjene

Iste osnovne upute možete koristiti s bilo kojim CSS izgledom uključenim u Dreamweaver. Da biste uredili stilove u CSS izgledu, slijedite ove korake:

Otvorite datoteku stranice koja se temelji na Dreamweaver CSS izgledu i odaberite Window→CSS Styles (ili kliknite karticu CSS Designer da proširite ploču).

Otvara se ili proširuje ploča CSS Designer.

Kliknite za odabir naziva stilske tablice na ploči Izvori na vrhu CSS Designera.

Svi stilovi povezani s novom stranicom navedeni su na ploči Selektora.

Odaberite naziv bilo kojeg stila navedenog na ploči CSS Designer Selectors.

Odgovarajuća CSS pravila definirana za stil prikazana su na ploči Svojstva, na dnu ploče CSS Designer. Klikom na popis stilova i pregled njihovih odgovarajućih pravila dobar je način da dobijete brzi pregled dizajna i da vidite gdje su pohranjene različite opcije oblikovanja stranice.

HTML5 oznake zaglavlja, .nav i podnožja kontroliraju glavne dijelove stranice. Na primjer, stil zaglavlja uključuje pravilo koje boju pozadine čini zelenom. Stoga, da biste promijenili boju područja zaglavlja na vrhu stranice, promijenite postavku boje pozadine u pravilu zaglavlja.

Kako urediti postavke cijele stranice

Za uređivanje postavki cijele stranice — kao što je boja pozadine stranice ili glavni font, veličina i boja teksta koji se koristi na cijeloj stranici — slijedite ove korake:

Na ploči CSS Designer Selectors odaberite stil pod nazivom tijelo.

Svojstva definirana u odabranom pravilu stila prikazana su na ploči Svojstva.

Kliknite ikonu T na vrhu ploče Svojstva i promijenite ili dodajte željeni font i druge postavke teksta.

Možete promijeniti lice fonta, veličinu, stil i težinu. Da biste promijenili razmak između redaka teksta, promijenite visinu reda.

Pomaknite se prema dolje do područja pozadine na ploči Svojstva i dobro upotrijebite boju u polju Boja pozadine da odredite boju za cijelu pozadinu stranice.

Alternativno, možete unijeti bilo koji heksadecimalni kod boje u polje Boja pozadine ili upotrijebiti kapaljku za uzorkovanje bilo koje boje. Da biste dodali pozadinsku sliku, kliknite u polje URL u odjeljku Pozadina, a zatim kliknite gumb Pregledaj koji se pojavi i odaberite sliku koju želite poslužiti kao pozadinu. Upotrijebite ikone za ponavljanje pozadine da odredite kako bi se pozadinska slika trebala ponavljati na stranici.

Napravite bilo koje druge izmjene ili dopune pravila stila.

Promjene pravila stila na ploči Svojstva automatski se spremaju i primjenjuju na sadržaj formatiran pravilom.

Kako prilagoditi područja sadržaja

Da biste promijenili širinu ili druge postavke područja glavnog sadržaja, koja kontroliraju ukupnu veličinu stranice i zaglavlja, podnožja i bočne trake, slijedite ove korake:

Za promjenu širine cijelog glavnog područja dizajna:

Kliknite stil .container na ploči Selectors na ploči CSS Designer.

Svojstva pravila stila .container prikazana su na ploči Svojstva, gdje također možete urediti stil.

Promijenite veličinu u polju Širina ili upišite novi broj za željenu širinu stranice.

Širina dizajna stranice automatski se mijenja na temelju veličine koju ste unijeli. Kada promijenite širinu stila .container, mijenjate širinu cijelog dizajna jer sve

oznake i drugi elementi sadržani su u

formatirani stilom .container — i svi su spremni za proširenje kako bi ispunili .container

.

Da biste promijenili veličinu područja sadržaja stranice, odaberite stil pod nazivom .content i odredite veličinu i druge opcije koje želite na ploči Svojstva.

Ako promijenite širinu područja sadržaja u izgledu koji uključuje bočnu traku, morate promijeniti i širinu bočne trake.

Da biste promijenili boju pozadine bilo kojeg stila na stranici, kliknite naziv odgovarajućeg stila i promijenite postavke u odjeljku Pozadina na ploči Svojstva.

Na primjer, u CSS izgledima u Dreamweaveru, bočna traka je definirana u stilu pod nazivom .sidebar1. Dakle, da biste promijenili boju pozadine, kliknite .sidebar1 na ploči Selectors, odaberite kategoriju pozadine na ploči Svojstva i odaberite boju koju želite. Slično tome, da biste promijenili boju pozadine zaglavlja, odaberite stil pod nazivom zaglavlje na ploči Selectors i dobro upotrijebite boju.

Za dodavanje slike u zaglavlje:

Odaberite sliku rezerviranog mjesta s oznakom Umetni logotip i pritisnite tipku Delete ili Backspace.

Odaberite Umetanje → Slika → Slika i odaberite sliku pomoću dijaloškog okvira Odabir izvora slike.

Zamijenite tekst i umetnite slike u bočnu traku i područja glavnog sadržaja.

Možete dodati ili zamijeniti tekst i umetnuti slike na bilo koju stranicu kreiranu iz CSS izgleda, baš kao što biste to učinili na bilo kojoj drugoj web stranici.

Odaberite Datoteka→Spremi sve da biste spremili stranicu i stilove.