Modificarea layout-ului cSS în Adobe CS5 Dreamweaver - dummies

Abode Creative Suite 5 (Adobe CS5) Dreamweaver oferă mai multe moduri de a schimba aspectul unei pagini de tip Cascading Style Sheets. Un aspect CSS este controlat complet de regulile foilor de stil, astfel încât să puteți modifica aspectul paginii direct din panoul CSS Stiluri și din inspectorul proprietății.

Fiecare coloană, cutie și spațiu de pe noua dvs. pagină sunt poziționate și dimensionate utilizând reguli și proprietăți CSS, toate acestea putând fi ajustate fie de la inspectorul Proprietăți (în panoul Stiluri CSS), fie de la panoul Definire a regulilor CSS.

1. Dacă panoul Șabloane CSS nu este deja deschis, alegeți Fereastră → Stiluri CSS pentru ao deschide.

2. Selectați fila Toate pentru a afișa foaia de stil și regulile acesteia.

   Fișa de stil internă este afișată ca în partea de sus. Dați clic pe săgeata spre stânga pentru ao extinde și pentru a afișa toate regulile pe care le conține. Dispozitivele care utilizează o foaie de stil atașată (externă) afișează numele foii de stil (cum ar fi stilurile.css) în loc de etichetă.

3. Selectați regula corpului.

   Acest stil bazat pe etichete controlează formatarea generală a întregii pagini (totul în interiorul etichetei).

4. Faceți clic pe câmpul de lângă regula de fundal pentru ao edita; mai degrabă decât să țineți setarea # 4E5869 (mediu gri), tastați o culoare hexazecimală (cum ar fi # CC0000 pentru roșu) pentru a schimba culoarea de fundal a paginii.

5. Faceți clic pe exemplul de lângă regula de culoare pentru a deschide panoul Swatches; alegeți o nouă culoare implicită pentru textul din pagină.

6. În partea de sus a panoului CSS Stiluri, selectați un alt stil (de exemplu, stilul twoColElstHdr #container) pentru a-i vedea proprietățile.

   The. TwoColHybLtHdr #Container stilul de identificare controlează dimensiunea și aspectul containerului de aspect principal din pagină.

7. În inspectorul Proprietăți, modificați proprietățile pentru a modifica aspectul stilului.

   De exemplu, puteți modifica lățimea regulii introducând un nou număr în caseta de text Width Rule. Dacă introduceți 95% , de exemplu, faceți întregul aspect mai extins.

Fiecare coloană și secțiune care cuprinde aspectul dvs. este controlată de unul dintre stilurile de identificare listate în panoul Stiluri CSS. Majoritatea fiecărui stil de identificare are o proprietate de lățime pe care o puteți utiliza pentru a modifica dimensiunile diferitelor zone din pagină.

Continuați să modificați diferitele stiluri afișate în panoul Stiluri CSS și să aflați cum afectează elementele diferite ale paginii dvs. Încercați să schimbați culoarea tipului, familia de fonturi și alte proprietăți, cum ar fi umplutura și culoarea de fundal.

Pentru a afla exact ce ID controlează coloana sau secțiunea, dați clic în zona de pagină și căutați selectorul de etichete din partea de jos a ferestrei Document.Ultima etichetă de la sfârșitul lanțului vă arată containerul în care vă aflați și codul său corespunzător din panoul Știri CSS (de exemplu).