Dreamweaver CS6: Tilføjelse af tekstskygger med CSS3 - dummies

En del af Dreamweaver CS6 For Dummies Cheat Sheet

I Dreamweaver CS6 kan du forbedre dine designs og give dine sider større dybde ved at tilføje tekstskygger med CSS3 regler, seneste inden for webteknologi. Tilføjelse af tekstskygger gør dine ord lettere at læse, især hvis dit design har en kompleks baggrund, eller hvis dine baggrunds- og tekstfarver mangler kontrast.

kredit: Paul Gual, istockphoto. com

Dreamweaver CS6 indeholder support til CSS3-tekstskygger, når du bruger panelet Egenskaber i panelet CSS-stilarter. Du kan oprette klasse- eller ID-stilarter med tekstskygger, og du kan tilføje tekstskygger til eksisterende HTML-elementer ved at definere en tagstil, som f.eks. Overskriften 1-stil, der bruges i billedet.

CSS3-koden, der opretter denne tekstskygge, er

h1 {tekstskygge: 2px 2px 3px # 000;}

Tallene i koden angiver, at tekstskyggen skal strække 2 pixels til højre og 2 pixels under teksten med en 3-pixel sløring. Desuden oprettes skyggen med farven sort, angivet med den forkortede hexadecimale farvekode # 000.

Når du opretter regler for tekstskygger, kan du angive op til fire værdier:

• Horisontal og vertikal: De første to talværdier er påkrævet, og angiv de vandrette og lodrette forskydninger - afstanden drop skyggen strækker sig under teksten (vandret) og til højre for teksten (lodret).

• Blurradius: Den tredje værdi angiver mængden af ​​uskarphed i skyggen. Hvis du ikke inkluderer blurradius, er standardværdien 0, hvilket gør, at skyggen vises som en solid farve.

• Farve: Den fjerde værdi angiver farven på skyggen og kan defineres ved hjælp af en hexadecimal farvekode eller en RGBa farvekode.

Du kan tilføje en tekstskygge ved hjælp af egenskabsruden nederst på panelet CSS Styles, som vist på billedet. Det gør du ved at følge disse trin:

1. Klik på linket Tilføj ejendom i venstre side af CSS Styles Property-ruden.

2. Indtast CSS3-stilregelnavnet, tekstskyggen eller vælg stilregel fra rullelisten.

   Efter navnet vises i venstre side vises en lille pil til højre.

3. Klik for at vælge pilen til højre for tekstskygge.

   Der vises en boks.

4. Indtast X- og Y-forskydningerne, slør radius og farve.