Cara membuat Text-Shadow

Update lagi cara membuat Text-Shadow. Banyak cara membuat variasi tampilan pada web ataupun blog kita, diantaranya kita bisa memberikan efek shadow pada teks. 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.



OK...!!!,  Ada dua cara dalam pembuatan text-shasow :

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 di sini !!

</h3>

Berikut hasilnya :

Tuliskan Teks di sini !!

2.  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>

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">

Teks Shadow disini

</div>

Berikut hasilnya :

Teks Shadow disini

Selamat mencoba dan Semoga bermanfaat....
Jangan lupa luangkan waktu untuk beri komentar ya......terima kasih.

Anda juga bisa berlangganan artikel-artikel terbaru dari saya, silahkan
anda gunakan tombol berlangganan artikel yang ada disebelah
kanan halaman ini, atau melalui tombol dibawah ini.

Judul: Cara membuat Text-Shadow; Ditulis oleh Unknown; Rating Blog: 5 dari 5

Dengan memasukan alamat email dibawah ini, berarti anda akan dapat kiriman artikel terbaru dari Blogger Tutorial | SEO | Free Blogger Templates | OOM RIO.com di inbox anda:

Related Posts

• Cara membuat background warna gradasiUntuk membuat background dengan warna gradasi, kita tidak perlu lagi menggunakan gambar sebagai backgroundnya. Tapi sekarang kita bisa menggunakan salah satu dari f ... readmore
• CSS LINKPenggunaan css pada fitur css link sangat bervariasi. Ada banyak fungsi pada fitur css link, kita bisa mengatur warna link, warna latar pada link, merubah warna pad ... readmore
• Cara membuat efek membesar pada gambarMemberikan efek membesar pada gambar adalah salah satu cara menjadikan web atau blog tampil menarik. Biasanya digunakan pada web atau blog yang banyak menampilkan g ... readmore
• Cara Membuat Navigasi HalamanCara lain untuk memudahkan pengunjung mencari artikel yang ada pada blog kita adalah memberi tombol navigasi halaman yang berada dibawah artikel. Selain memberikan ... readmore
• Cara membuat efek shadow pada kotak dan gambar Penggunaan css3 memang menajubkan. Css3 merupakan pengembangan dari css 1 dan css 2. Keunggulan CSS3 memiliki banyak fitur. seperti shadow, transparansi, gradiasi ... readmore