Sedikit Info Seputar
Cara Memasang Efek Transparan pada Gambar di Blogger
Terbaru 2017
- Hay gaes kali ini team Free Template BLogspot.Com, kali ini akan membahas artikel dengan judul Cara Memasang Efek Transparan pada Gambar di Blogger, kami selaku Team Free Template BLogspot.Com telah mempersiapkan artikel ini untuk sobat sobat yang menyukai Free Template BLogspot.Com. semoga isi postingan tentang
Artikel desain,
Artikel tips trik blogging, yang saya posting kali ini dapat dipahami dengan mudah serta memberi manfa'at bagi kalian semua, walaupun tidak sempurna setidaknya artikel kami memberi sedikit informasi kepada kalian semua. ok langsung simak aja sob
Judul:
Berbagi Info Seputar
Cara Memasang Efek Transparan pada Gambar di Blogger
Terbaru
link: Cara Memasang Efek Transparan pada Gambar di Blogger
"jangan lupa baca juga artikel dari kami yang lain dibawah"
Berbagi
Cara Memasang Efek Transparan pada Gambar di Blogger
Terbaru dan Terlengkap 2017
Cara Memasang EfekTransparan pada Gambar di Blogger – Ada banyak efek CSS yang dapat dipasangkan pada gambar di blog. Seperti efek zoom gambar yang pernah saya bahas beberapa waktu yang lalu. Kali ini topiknya tidak jauh – jauh dari CSS, yaitu efek transparan pada gambar di blog. Efek ini akan memberikan kesan transparan saat pointer mouse tidak diletakkan diatas gambar. Gambar akan kembali terlihat jelas apabila pointer mouse diletakkan diatas gambar. Untuk preview-nya, silahkan lihat disini.
Pada dasarnya, kode CSS efek transparan pada gambar ini tidak jauh berbeda dengan kode CSS untuk efek yang pernah saya bahas sebelumnya. Perhatikan kode CSS dibawah ini :
.brl-transparan {opacity: 0.5;filter:alpha(opacity=50);}
.brl-transparan:hover {opacity:1.0;filter:alpha(opacity=100);}
Kode tersebut jika dipasangkan akan memberikan efek seperti pada preview diatas. Untuk mengubah transparasi gambar, gantilah variable opacity: 0.5 dan opacity=50 pada baris pertama. Untuk opacity: 0.5 Anda dapat menggantinya dengan angka yang lebih kecil dari 1.0. Sedangkan untuk opacity=50, Anda dapat menggantinya dengan angka bernilai lebih kecil dari 100. Kedua kode tersebut berfungsi untuk menentukan seberapa transparan gambar Anda nantinya. Anda dapat mengubahnya, atau membiarkannya seperti semula.
Untuk memasang efek tranparan pada gambar di blog Anda, ikuti langkah – langkah dibawah ini :
1. Buka akun blogger Anda, lalu klik Template.
2. Buat sebuah backup / cadangan dari template blog Anda.
3. Lalu klik Edit HTML.
4. Klik kotak dengan kode HTML yang muncul, lalu tekan ctrl+f.
5. Carilah kode ]]></b:skin>, lalu pastekan kode CSS berikut ini tepat diatas/sebelum kode ]]></b:skin>.
.brl-transparan {opacity: 0.5;filter:alpha(opacity=50);}
.brl-transparan:hover {opacity:1.0;filter:alpha(opacity=100);}
6. Terakhir, klik Simpan Template.
Sedangkan, untuk mengaplikasikan kode CSS ini pada gambar di blog Anda, tambahkan kode class=’brl-transparan’ pada HTML gambar. Contoh pemasangan efek transparan pada kode HTML gambar di blog :
<img class=’brl-transparan’ border=’0’ src=’http;//urlgambar.anda’ />
Untuk memasang kode CSS ini pada link tambahkan kode class=’brl-transparan’ setelah <a.
Contoh :
<a class=’brl-transparan’ href=’http://urlgambar.anda’ ... />
Selamat mencoba, dan salam blogger!
Itulah sedikit Artikel Cara Memasang Efek Transparan pada Gambar di Blogger terbaru dari kami
Semoga artikel Cara Memasang Efek Transparan pada Gambar di Blogger yang saya posting kali ini, bisa memberi informasi untuk anda semua yang menyukai Free Template BLogspot.Com. jangan lupa baca juga artikel-artikel lain dari kami.
Terima kasih Anda baru saja membaca Cara Memasang Efek Transparan pada Gambar di Blogger
