Thursday, February 2, 2012

Teks Transparan Dengan CSS3

Teks Transparan Dengan CSS3

Teks Transparan Dengan CSS3, ini mampu memberi kehidupan di dalam seni teks hehhehe ( sok seni segala hehehe), Teks Transparan Dengan CSS ini juga terlihat lebih indah menurut saya dengan style2 yang bisa di kembangkan lebih lanjut oleh anda - anda semua yang membaca postingan ini, ok dari pada bersusah - susah membaca tulisan saya mending kita bersenang - senang melihat DEMO nya, lihat demonya di bawah ini

DEMO

Pastikan Peramban anda mendukung CSS3 karena di DEMO semua serba CSS3 sesuai dengan teks yang ada di dalam nya yaitu serba css3 moga - moga aja browser anda bisa melihat secara modern, agar demo nya terlihat secara sempurna dan atraktif.
karena di demo saya lengkapi dengan efek transition agar pergerakan teks yang ber-background kuning itu lebih lembut dan halus hehehheehe kayak kulit aja halus, kode warna pada teks yang di gunakan adalah kode warna RGBA ( red, green, blue, alpha ) jadi jika anda ingin gunakan pada teks silahkan gunakan kode warna RGBA di bawah ini di dalam Class css anda,

color:rgba(255, 255, 255, 0.5);

itu adalah kode warna putih, untuk mencari kode warna RGBA silahkan ke css3 generator, nah di menu drop down nya silahkan pilih RGBA dan tuliskan di sana kode warna dan opacity nya contoh opacity nya yaitu yang 0.5, sebenarnya kalau gak mau repot silahkan lihat kode warna RGB di Photoshop, dan nanti saat anda ingin memberi efek alpha atau opacity nya silahkan ganti saja teks RGB dengan RGBA dan tambahkan opacity di belakang nya jadi jika kode warna RGB biasa seperti ini

color:rgb(255, 255, 255);

Dan setelah anda rubah teks RGB ke RGBA maka kodenya juga harus ada tambahan nya yaitu efek opcity nya dan kodenya pun akan jadi seperti di bawah ini

color:rgba(255, 255, 255, 0.5);

Anda lihat kan kode warna merah yang 0.5 itu yang bikin efek transparan pada teks, kode RGBA juga bisa di buat untuk background silahkan utak atik sendiri nanti hehehe semoga sedikit postingan ini bisa menambah referensi anda dalam mendalami CSS dan semoga bermanfaat buat anda semua sekian / wassalam

17 komentar postingan ini

bagus sob..., izin save tutorial diatas.., terima kasih.. :D

ane sekian lama udah nyoba sob thanks karena uda share semoga ajha artikel ini selalu bermanfaat bagi para pembaca

ooowh jadi gitu ya caranya.
thanks buat infonya gan..:)

tutornya makin hebat nih :D wooow

Manteb ini artikel kawan , salam kenal ya kawan kebetulan saya juga lagi belajar mengenai css kawan , Happy bloging

wah udah berkali kali lo sampean ucapin salam kenal,

ya ya ya transparan ini jg, hampir bs kita temui di opacity ;)

Yups ini adalah opcity warna RGB

iya nih, sama ga kalo kota buat dengan opacity:0.5; ?

Thenkyu sob atas postinganya pada awalnya saya ga ngerti karena baru di dunia blog.. tapi setelah utak atik kode html akhirnya bisa dimengerti jg..

Jika ingin memasukan gambar gunakan tag
[img]url gambar[/img]
Jika Video
[youtube]URL Video[/youtube]
Jika kata - kata mutiara gunakan
[blockquote]Kata-kata Anda[/blockquote]
Emoticon
EmoticonEmoticon