Video: Photoshop Tutorial - Simpel Schaduw Effect 2024
U kunt uw ontwerpen verbeteren in Dreamweaver en uw pagina's meer diepte geven door slagschaduwen toe te voegen aan afbeeldingen, tags en andere elementen. Als u tekstschaduwen toevoegt, zijn uw woorden gemakkelijker te lezen, vooral als uw ontwerp een complexe achtergrond heeft of als de voorgrond- en achtergrondkleuren geen contrast hebben.
Credit: Foto door iStockphoto. comDreamweaver CC biedt betere ondersteuning en integratie van CSS3-slagschaduwen en tekstschaduwen in het nieuwe CSS Designer-venster.
U kunt klasse- of ID-stijlen maken met tekstschaduwen en u kunt tekstschaduwen toevoegen aan bestaande HTML-elementen door een labelstijl te definiëren, zoals de kop 1-stijl die u hier ziet. De CSS3-code die die tekstschaduw maakt, is
h1 {text-shadow: 2px 2px 2px # 000;}
De getallen in de code geven aan dat de tekstschaduw 2 pixels naar rechts en 2 pixels onder de afbeelding moet verlengen tekst met een vervaging van 2 pixels. Bovendien wordt de schaduw gemaakt met de kleur zwart, opgegeven door de afgekorte hexadecimale kleurcode # 000.
Wanneer u regels voor tekstschaduwen maakt, kunt u maximaal vier waarden opgeven:
-
horizontaal en verticaal : de eerste twee nummerwaarden zijn vereist en geven de horizontale waarde aan en verticale verschuivingen - de afstand die de slagschaduw zich onder de tekst (verticaal ) en rechts van de tekst (horizontaal) uitstrekt.
-
vervagingsstraal : de derde waarde geeft de mate van onscherpte in de schaduw aan. Als u de blur-straal niet opneemt, is de standaardwaarde 0, waardoor de schaduw als een effen kleur wordt weergegeven.
-
kleur : de vierde waarde geeft de kleur van de schaduw aan en kan worden gedefinieerd met een hexadecimale kleurcode of een RGBa-kleurcode.
Als u een RGBa-kleur kiest voor de optie Kleur, krijgt u meer controle over het uiterlijk van de schaduw, omdat u transparantie kunt toevoegen.
U kunt een tekstschaduw toevoegen met behulp van het paneel Eigenschappen onder aan het deelvenster CSS-ontwerp. Hiertoe gaat u als volgt te werk:
-
Ga naar de sectie Tekstschaduw van het paneel CSS Designer-eigenschappen.
-
Voer de grootte in van de schaduw die u wilt weergeven met de velden H-shadow (horizontaal) en V-shadow (verticaal).
-
Voeg de hoeveelheid vervaging toe die u wilt voor uw tekstschaduw door een grootte in te voeren in het veld Vervagen.
-
Klik op de kleur en selecteer de kleur die u wilt gebruiken in de tekstschaduw.