News Update :

Sunday, August 14, 2011

Membuat Text-Shadow

Share this article :

09:46 |

Penggunaan efek shadow pada teks merupakan salah satu bagian trik yang bagus, selain teks lebih enak dibaca juga agar web ataupun blog tampil lebih menarik dan terkesan lebih elegan. Tapi tentu dalam pemberian efek shadow pada teks juga harus disesuaikan besar kecilnya ukuran font, gelap terangnya efek shadow yang tampil, dan lebar tidaknya efek blur yang muncul. Dan semua itu bisa kita atur nilainya agar teks yang kita buat menggunakan efek ini lebih enak dibaca dan tampil lebih indah.

Ada 2 cara dalam pembuatan text-shadow silahkan ikuti langkah-langkah dibawah ini :

1. Menggunakan kode html (xhtml)

Kita bisa secara langsung membuat Text Shadow pada area posting, dengan cara menambah kode html pada area html. Berikut adalah cara penulisan kode HTML :

<h3 style="color: #01022c; font-family: staccato222 BT; font-size: 2em; font-weight: 700; line-height: 1.2em; padding: 3px 10px; text-shadow: 0.1em 0.1em 0.2em rgb(119, 119, 119);">
Tuliskan Teks anda disini !!
</h3>


2. Berikut Hasilnya :

Tuliskan Teks di sini !!


3. Menggunakan kode CSS.
Untuk cara yang ini anda harus menyisipkan kode Css pada Template, tepatnya anda bisa letakkan kode Css sebelum tag </head>.


Berikut contoh teks shadow menggunakan kode Css :

<style type='text/css'>
.teks-shadow {
color: #01022c;
font-family: staccato222 BT;
font-size: 2em;
font-weight: 700;
line-height: 1.2em;
padding: 3px 10px;
text-shadow: 0.1em 0.1em 0.2em rgb(119, 119, 119)
}
</style>

4. Kemudian untuk menampilkan text shadow kita tinggal menambah kode html pada widget atau area posting ataupun dimana anda akan menempatkan teks shadow sesuai kebutuhan anda.

<div class="teks-shadow">
Tulis Text anda disini !!
</div>


Berikut hasilnya :

Tulis Teks anda disini !!


5. Semoga bermanfaat

Note :- Kindly g+1 this post if you found it useful
Euro Live Streaming
You Might Also Like :


Post a Comment