Sebelumnya kita telah membuat CSS dimana ada teks didalam kotak transparan dengan gambar latar. Nah sekarang saya akan menunjukkan bagaimana gambar transparan ketika kita sorot dengan kursor mouse / mouse hover.
- Buka Adobe Dreamweaver
- File - New - HTML
- Masukkan gambar dengan mengetikkan kode berikut diantara tag <body> dan </body>
- Misal <img src="image/kiri_atas.png" />
- Setelah itu, buat file CSS, File - New - CSS
- Ketikkan kode berikut didalam file CSS anda
img
{
opacity:0.4;
filter:alpha(opacity=40);
}
img:hover
{
opacity:1.0;
filter:alpha(opacity=100);
}
{
opacity:0.4;
filter:alpha(opacity=40);
}
img:hover
{
opacity:1.0;
filter:alpha(opacity=100);
}
- JANGAN LUPA MENGHUBUNGKAN KEDUA DOKUMEN
- Save
- Selesai
No comments:
Post a Comment