Hallo teman-teman, bertemu lagi dengan saya di website ini. Pada kali ini saya akan memberikan tutorial Membuat Image Hover Keren dengan CSS3. Sebelum kita memulainya seperti biasa teman-teman harus sudah mengenal dengan HTML dan CSS agar dapat dengan mudah memahami artikel ini.

Didalam pembahasan kali ini sebenarnya banyak image hover yang keren jika teman-teman lihat atau mencarinya di google. Pada dasar nya semuanya dengan tujuan yang sama yaitu membuat tampilan websitenya agar lebih menarik dan bagus.

Oke langsung saja kita mulai cara Membuat Image Hover Keren dengan CSS3. Pertama-tama teman-teman siapkan terlebih dahulu text-editornya kemudian ketik script HTML dibawah ini :

Jika sudah simpan file HTML tersebut kemudian langkah selanjutnya teman-teman masukan script CSS dibawah ini kedalam text-editornya :

Jika sudah simpan file CSS nya. Lalu kemudian jika teman-teman menggunakan CSS external maka teman-teman harus menghubungkan antara file HTML dan file CSSnya dengan menggunakan <link rel=”stylesheet” type=”text/css” href=”namafile.css”> Lalu kemudian tambahkan sedikit javascript seperti dibawah ini :

Jika sudah silahkan langsung saja teman-teman jalankan/run di browser yang teman-teman gunakan. Maka hasilnya akan Nampak seperti pada gambar dibawah ini :

Membuat Image Hover Keren dengan CSS3

Jika hasil teman-teman sudah seperti pada gambar diatas maka teman-teman dinyatakan telah berhasil dalam Membuat Image Hover Keren dengan CSS3.

Oke kalau begitu cukup sampai disini pembahasan kali ini dalam Membuat Image Hover Keren dengan CSS3 dan semoga bermanfaat untuk teman-teman

Terimakasih