html图片浮动特效
html代码:
<div >
<table border="0" >
<tr >
<td width="200",height="300"> </td>
<td width="200",height="300"> </td>
<td width="200",height="300"> <a href="2.html"><img class="mid1" src="img/mid1.png" width="200",height="300"> </td>
<td width="200",height="300"> <a href="2.html"><img class="mid1" src="img/mid2.png" width="200",height="300"> </td>
<td width="200",height="300"> <a href="2.html"><img class="mid1" src="img/mid3.png" width="200",height="300"> </td>
<td width="200",height="300"> <a href="2.html"><img class="mid1" src="img/mid4.png" width="200",height="300"> </td>
</tr>
<tr >
<td width="200",height="300"> </td>
<td width="200",height="300"> </td>
<td width="200",height="300"> <a href="2.html"><img class="mid1" src="img/mid5.png" width="200",height="300"> </td>
<td width="200",height="300"> <a href="2.html"><img class="mid1" src="img/mid6.png" width="200",height="300"> </td>
<td width="200",height="300"> <a href="2.html"><img class="mid1" src="img/mid7.png" width="200",height="300"> </td>
<td width="200",height="300"> <a href="2.html"><img class="mid1" src="img/mid8.png" width="200",height="300"> </td>
</tr>
</table>
</div>
css代码:
div img.mid1{
width: 500;
cursor: pointer;
transition: all 0.6s;
}
div img.mid1:hover{
transform: scale(1.4);
}
效果截图: