Membuat CSS Text Shadow

Penggunaan text shadow banyak yang bisa kita lakukan dan masih banyak lagi yang akan kita praktekan. mungkin anda bisa berexperiment dengan berbagai jenis text shadow. dan di bawah hanya sample saja.

CSS

.fire-text p
 {
 font-family:Times New Roman, Times, serif;font-size:60px;
 color:#000;
 text-shadow:0px -1px 2px #FFFF00,1px -3px 3px #FFCC00,0px -5px 4px #FF9900,-1px -7px 5px #FF6600,3px -9px 6px #FF3300,5px -13px 37px #FF0000;
 }

HTML

<div class="fire-text">
 <p>CSS TUTS</p>
</div>

Contoh 1 :

CSS TUTS

Dan ini text shadow yang tampak seperti menempel dengan background,dan warna text harus selaras dengan warna background. anda harus benar-benar pintar memilih warna yang tepat.

CSS

.grey-text p
 {
 font-family:Times New Roman, Times, serif;font-size:60px;
 color:#ccc;
 text-shadow:-1px -1px 0px #666666,1px 1px 0px #FFFFFF;;
 }

HTML

<div class="grey-text">
 <p>CSS TUTS</p>
</div>

Contoh 2 :

CSS TUTS