Property CSS3 Opacity mengijinkan kita untuk membuat transparansi dari suatu objek atau unsur. Penggunaan property ini akan sangat membantu untuk memberikan kesan lebih cantik pada menu, gambar atau unsur-unsur lainnya.

Properti Opacity membutuhkan nilai di antara 0,0 (setara dengan 100 transparansi%) dan 1,0 (tidak ada transparansi). Misalkan kita membuat transparansi 60 % , maka bisa menggunakan kode berikut :

opacity: 0.6;

Opacity tidak mendapatkan dukungan dari Internet Explrer, jadi tidak akan terjadi apa-apa jika situs di buka dengan browser Internet Explorer. Kode yang mempunyai fungsi sama dengan opacity yang telah diimplementasikan oleh microsoft adalah “alpha filter “.

Nilai properti untuk alpha filter adalah 0 ( untuk transparansi sempurna) dan 100 ( tidak transparansi). Sebagai contoh jika antum ingin membuat transparansi 60% diCSS agar bisa tampil baik di IE adalah sebagai berikut:

filter: alpha(opacity=60); /*for Internet Explorer 6/7*/
filter: “alpha(opacity=60)”; /*for Internet Explorer 8*/

Baiklah, langsung aja ke TKP untuk contoh pembuatan atau penerapan kode opacity ini:

Semoga bermanfaat.

Postingan hebat lainnya yang berhubungan :

1. Cara membuat list-style dengan css
2. Quick Referrence Guide Kode css3
3. Cara Membuat Scrollbar Box Warna Dengan Bantuan CSS (style.css)
4. Cara Mudah Membuat Blinking Text Dengan Bantuan CSS Theme
5. Cara Sangat Mudah Membuat Post Thumbnail Dengan Timthumb
6. Cara Membuat ScrollBar Box Dengan Isi Random Post
7. Cara Membuat Efek Teks Mengetik (Ticker Text) Pada Mesin WordPress
8. Cara Mudah Membuat Blinking Text Yang Valid XHTML1