Skip to content Skip to sidebar Skip to footer

Membuat Text-Shadow

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

Post a Comment for "Membuat Text-Shadow"

Template Blogger Terbaik Rekomendasi