图片放大后，右下角文字位置跟随一起变化

<!DOCTYPE html>
<html>
   <head>
       <meta charset="utf-8">
       <title></title>
       <style>
           .img{200px;height:130px;position: relative;}
           .img:hover{
               transform:scale(3);
                z-index:9999;
                -ms-transform: scale(3);   /* IE 9 */
                -webkit-transform: scale(3);   /* Safari 和 Chrome */
                -o-transform: scale(3);   /* Opera */
                -moz-transform: scale(3);   /* Firefox */
               }
           .num{position: absolute;right:0;bottom:0;}
       </style>
   </head>
   <body>
       <ul>
           <li class="img">
               <img src="1355060775.jpg" />
               <a href="#" class="num">2张</a>
           </li>
       </ul>
   </body>
</html>