1. Classic Letterpress Effect
#letterpress h1 {
text-shadow: 0px 1px 1px #4d4d4d;
color: #222;
font: 80px 'LeagueGothicRegular';
}
2. Cloudy Text Effect
#cloud9 h1 {
text-shadow: 0px 0px 10px rgba(255,255,255,0.6), 0px 0px 30px rgba(255,255,255,0.4), 0px 0px 50px rgba(255,255,255,0.3), 0px 0px 180px rgba(255,255,255,0.3);
color: rgba(255,255,255,0);
font: 80px 'ChunkFiveRegular';
}
3. Embossed Text Effect
#embossed h1 {
text-shadow: -1px -1px 1px #fff, 1px 1px 1px #000;
color: #9c8468;
opacity: 0.3;
font: 80px 'Museo700';
}
4. City Lights Text
#citylights h1 {
color: #fff;
text-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 15px #fff, 0 0 20px #ff2d95, 0 0 30px #ff2d95, 0 0 40px #ff2d95, 0 0 50px #ff2d95, 0 0 75px #ff2d95;
letter-spacing: 5px;
font: 80px 'MisoRegular';
}
5. Burning Text Effect
#burning h1 {
color: #fff;
text-shadow: 0px -1px 4px white, 0px -2px 10px yellow, 0px -10px 20px #ff8000, 0px -18px 40px red;
font: 80px 'BlackJackRegular';
}
6. Retro Text Effect
#retro h1 {
color: #d7ceb2;
text-shadow: 3px 3px 0px #2c2e38, 5px 5px 0px #5c5f72;
font: 80px 'BazarMedium';
letter-spacing: 10px;
}
7. 3D Text Effect
#three-d h1 {
color: #fff;
text-shadow: 0px 1px 0px #999, 0px 2px 0px #888, 0px 3px 0px #777, 0px 4px 0px #666, 0px 5px 0px #555, 0px 6px 0px #444, 0px 7px 0px #333, 0px 8px 7px #001135;
font: 80px 'ChunkFiveRegular';
}
Untuk pemanggil Cssnya gunakan kode HTML berikut :
<div id="Ganti Sesuai efek yang anda inginkan">
<h1>Ganti Dengan Teks Yang Anda Inginkan</h1>
</div>
Note : Jangan lupa ganti teks yang ditandai sesuai keinginan anda...!!!
Demikian penjelasan artikel tentang Memberi Efek Pada Text Menggunakan Css Text-Shadow semoga bermanfaat dan selamat berkreasi salam Landblogging Terima Kasih.