Lakukan lebih banyak, lakukan lebih baik, lakukan lebih cepat dan tuntaskan lebih rapi. Kesempatan kali ini saya akan share kepada kalian tentang bagaimana Cara Membuat Hoverable Image dengan W3.CSS.
Ada yang sudah tau dengan Hoverable Image? Oke saya jelaskan sedikit tentang apa itu Hoverable Image. Hoverable Image itu adalah gambar yang kemudian ada efek pada saat kita hover atau pada saat kursos berada pada gambar tersebut, maka akan ada efek yang keluar.
Oke langsung saja kita praktekkan, berikut Cara Membuat Hoverable Image dengan W3.CSS.
Pertama-tama, seperti biasa siapkan file index.html nya.
Kemudian, isi di bagian <head> link untuk menghubungkan HTML kita dengan library dari W3.CSS nya.
<link rel="stylesheet" href="http://www.w3schools.com/lib/w3.css">
Setelah itu, isi di bagian <body> tag-tag di bawah.
<body class="w3-container"> <h2>Hoverable Image</h2> <p>Coba arahkan kursor ke gambar:</p> <img src="img_fjords.jpg" class="w3-hover-opacity" alt="Norway" style="width:50%"> </body>
Bagaimana teman-teman? cukup mudah bukan?
Sekian untuk tutorial kali ini tentang Cara Membuat Hoverable Image dengan W3.CSS.
Semoga bermanfaat, terima kasih
The post Cara Membuat Hoverable Image dengan W3.CSS appeared first on Kursus Website Terbaik.