Pada postingan kali ini saya akan mengajak anda untuk membahas tentang penggunaan kode CSS dalam membuat teks bayangan (shadow). Ini adalah pengalaman saya ketika saya masih sering otak-atik wapsite di xtgem.com. Dengan menggunakan teks bayangan, teks yang kita buat terasa lebih unik dan lebih hidup. Sebagai contoh sederhana bisa anda lihat di bawah ini.
TEKS DENGAN SATU BAYANGAN
Anda dapat membuat teks bayangan seperti contoh di atas dengan kode CSS seperti berikut.
<div style="text-shadow: 4px 3px 2px #3399FF;">TEKS DENGAN SATU BAYANGAN</div>
keterangan:
* 4px adalah jarak kekanan antara teks dengan bayangan.
* 3px adalah jarak kebawah antara teks dengan bayangan.
* 2px adalah tebal teks bayangan.
* #3399FF adalah kode warna untuk teks bayangan.
* silakan ganti teks "TEKS DENGAN SATU BAYANGAN" dengan teks anda.
Selanjutnya dengan sedikit penambahan penggunaan kode minus (-) pada kode di atas maka akan menghasilkan teks bayangan seperti di bawah ini.
TEKS DENGAN DUA BAYANGAN
penambahan kodenya seperti ini.
<div style="text-shadow: 4px 3px 2px #3399FF, -4px -3px 2px #FF9933;">TEKS DENGAN DUA BAYANGAN</div>
keterangan:
* 4px adalah jarak kekanan antara teks dengan bayangan.
* 3px adalah jarak kebawah antara teks dengan bayangan.
* 2px adalah tebal teks bayangan yang berada di kanan bawah.
* #3399FF adalah kode warna untuk teks bayangan yang berada di kanan bawah teks.
* -4px adalah jarak kekiri antara teks dengan bayangan.
* -3px adalah jarak keatas antara teks dengan bayangan.
* 2px adalah tebal teks bayangan yang berada di kiri atas.
* #FF9933 adalah kode warna untuk teks bayangan yang berada di kiri atas.
* silakan ganti teks "TEKS DENGAN DUA BAYANGAN" dengan teks anda.
Kode-kode di atas adalah sebagian kecil dari penggunaan CSS dalam membuat teks bayangan. Selanjutnya bagi anda yang familiar dengan kode CSS, anda dapat berkreasi untuk menghasilkan teks yang lebih unik lagi.
4 Comments:
wah pernah di xtgwm juga ya mas? aku dulu juga sempet buat.. mampir ja mansuka.xtgem.com
Iya mas, hehe,,, sebenernya saya lebih dulu di blogspot, tapi berhubung saya lum tahu apa-apa tentang kode HTML dkk. Sayapun pindah ke xtgem.com untuk belajar, :D salah satu wap yang jadi guru saya ya cyberbali.jw.lt dari link ke link ketemu blog mas, xixi... Kog malah dongeng... Ok mas segera ke TKP.
tes
menarik sekali untuk disamak
Blog ini "DOFOLLOW", Silakan tinggalkan komentar anda, bebas tapi sopan. Tidak kami anjurkan untuk mencantumkan link pada komentar serta memakai nama Anonymous.
Komentar yang bernada SPAM atau SARA akan kami hapus.
Post a Comment