1. Langkah pertama adalah membuat script untuk CSSnya, yaitu seperti berikut:
<style>
.image{
width:100px;
height:auto;
border:1px solid #666;
}
.image:hover{
width:500px;
box-shadow:0px 0px 10px #666;
}
</style>
2. Lagnkah kedua adalah membuat script HTML untuk menampilkan gambar.Kemudian letakkn script CSS diatas diantara tag head. Berikut adalah script HTMLnya:
<html>
<head>
<style>
.image{
width:300px;
height:auto;
border:1px solid #666;
}
.image:hover{
width:500px;
box-shadow:0px 0px 10px #666;
}</style>
</head><body>
<img class="image" src="img.jpg">
</body>
</html>
Berikut adalah contoh tampilanya:
Selamat mencoba !
No comments:
Post a Comment