Dreamweaver CS6: Adăugarea textului Shadows cu CSS3 - dummies

O parte din Dreamweaver CS6 pentru chestii Cheat Sheet

În Dreamweaver CS6, puteți îmbunătăți desenele și oferiți paginilor dvs. o profunzime mai mare adăugând texte umbrite cu reguli CSS3 cea mai recentă tehnologie web. Adăugarea de umbre de text face ca cuvintele dvs. să fie mai ușor de citit, mai ales dacă designul dvs. are un fundal complex sau dacă culorile fundalului și textului nu au contrast.

credit: Paul Gual, istockphoto. com

Dreamweaver CS6 include suport pentru umbrele textului CSS3 când utilizați panoul Proprietăți din panoul Stiluri CSS. Puteți crea stiluri de clasă sau ID cu umbre de text și puteți adăuga umbre de text elementelor HTML existente prin definirea unui stil de etichetă, cum ar fi stilul de titlu 1 utilizat în imagine.

Codul CSS3 care creează acea umbră a textului este

h1 {text-shadow: 2px 2px 3px # 000;}

Numerele din cod specifică faptul că umbra de text trebuie extinsă la 2 pixeli spre dreapta și 2 pixeli de sub text, cu o estompare de 3 pixeli. În plus, umbra este creată cu culoarea neagră, specificată prin codul de culoare hexazecimal abreviat # 000.

Orizontal și vertical:

• Sunt necesare primele două valori numerice și se specifică compensările orizontale și verticale - distanța umbra de picătură se extinde sub text (orizontală) și în partea dreaptă a textului (vertical). Raza de estompare:

• A treia valoare specifică cantitatea de neclaritate din umbră. Dacă nu includeți raza de estompare, valoarea implicită este 0, ceea ce face umbra să apară ca o culoare solidă. Culoarea:

• A patra valoare specifică culoarea umbrei și poate fi definită utilizând un cod de culoare hexazecimal sau un cod de culoare RGBa. Puteți adăuga o umbră de text utilizând panoul Proprietăți din partea de jos a panoului Stiluri CSS, după cum se arată în imagine. Pentru a face acest lucru, urmați acești pași:

Faceți clic pe linkul Adăugare proprietate din partea stângă a panoului Proprietăți CSS Stiluri.

1. Introduceți numele regulii stilului CSS3, umbra de text sau selectați regula stilului din lista derulantă.

2. După ce numele apare în partea stângă, o mică săgeată apare în partea dreaptă.

   Faceți clic pentru a selecta săgeata din partea dreaptă a umbrei de text.

3. Apare o casetă.

   Introduceți offseturile X și Y, raza de estompare și culoarea.