WEBFEJLESZTÉS, WEBÁRUHÁZ KÉSZÍTÉS   Ingyenes elektronikus tananyag interaktív
weboldalak készítéséhez.
Custom Search
 
vissza VISSZA    
menü MENÜ    
ismét ISMÉT    
tovább TOVÁBB    

A szöveg árnyéka



A text-shadow tulajdonság segítségével a szöveg árnyékát állíthatjuk be.

A szóköz beállítása:

kijelölő
{
text-shadow
:
érték
érték
érték
érték;
}


1. érték: az árnyék vízszintes kiterjedése (– balra + jobbra)

2. érték: az árnyék függőleges kiterjedése (– le + fel)

3. érték: az árnyék elmosódás (0 éles + elmosódik)

4. érték: Az árnyék színe

A text-shadow tulajdonság paramétereinek megduplázásával két árnyékot is beállíthatunk. Ezzel pedig vésett hatást érhetünk el.

Példa:

Forráskód



<style>
  p {font: bold 22px/34px Verdana, Geneva, sans-serif;}
  .p1 {text-shadow:-2px -2px 2px red;}
  .p2 {text-shadow:5px 5px 15px red;} 
  .p3 {text-shadow:1px 1px 0px #ffeeee, 2px 2px 0px #000000;} 
</style>     
...
<body>            
  <p class="p1">text-shadow:-5px -5px 1px red; </p>  
  <p class="p2">text-shadow: 5px 5px 15px red; </p>   
  <p class="p3">text-shadow:1px 1px 0px #ffeeee, 2px 2px 0px #000000; </p> 
</body>
 

Eredmény*


* Az eredmény megjelenítése az Ön által használt böngészőtől függ.
A példakód külön ablakban is megtekinthető: css_szoveg_arnyek_01.html