CSS3 | Efek Text Menyala

Cara Membuat Text Efek Menyala. Perhatikan text di bawah. Terlihat seperti menyalakan? Jika tidak mungkin faktor browser anda, karena efek ini hanya terlihat di browser tertentu saja seperti Firefox, Google Chrome, dan Safari Terbaru.

LINK MENYALA

Secara teknis sebenarnya efek ini menggunakan efek text shadow dengan CSS3. Dan dengan sedikit modifikasi RGBA jadilah efek text menyala ini. Langsung saja ke cara pembuatan texk menyala ini.

Kode yang saya gunakan untuk membuat text menyala di atas adalah seperti ini

text-shadow: rgba(255, 150, 220, 1) 0px 0px 8px;

yang artinya kurang lebih seperti ini :

• text-shadow = buatlah bayangan pada text
• rgba(255, 150, 220, 1) = Warna dengan komposisi RGB dan Alpha (R, G, B, Alpha). Ganti sesuai warna cahaya yang anda inginkan --untuk mencari komposisi warna RGB, kamu bisa menggunakan photoshop--
• 0 0 8px = 0(ofset x) 0(ofset y) 8px(lebar/blur bayangan)

Sekarang untuk penerapan di Blog.

1. Login ke blog anda
2. Masuk ke Design > Edit HTML
3. Cari kode yang anda inginkan untuk di buat menyala. Contoh Link menyala maka yang di cari adalah kode a:link {. Maka tambahkan kode Text menyala di dalamnya. Contoh :

a:link {

text-shadow: rgba(255, 150, 220, 1) 0px 0px 8px;

color : #3778cd;
text-decoration : none;
}

4. Save Templates dan lihat apa yang terjadi pada link anda? Menyalakan? Bagus. Jika tidak berarti Seperti yang saya bilang tadi. Faktor Browser.

Text lain yang bisa di beri efek menyala. h1{ , h2 { , h3 { , .post { , dll

Sekian posting dari saya, semoga bermanfaat saya akhiri Wassalam