transform

neokoni · Dec 28, 2023 · 0d63c68 · 0d63c68
1 parent 44a6893
commit 0d63c68
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 3 deletions.
diff --git a/css/main.css b/css/main.css
@@ -61,3 +61,22 @@ a.alipay {
     background-color: #c9c9c9;
     height: 2px;
 }
+
+.qq{
+    transition-duration: 0.4s;
+}
+
+.qq:hover{
+    transform:scale(1.3) ;
+    background-color: #FBFBFF;
+    margin-top: -200px;
+}
+
+.wechat{
+    transition-duration: 0.4s;
+}
+.wechat:hover{
+    transform:scale(1.5) ;
+    background-color: #FBFBFF;
+    margin-left: -100px;
+}
diff --git a/index.html b/index.html
@@ -36,14 +36,14 @@
             <div></div>
             <!-- AliPay QR-code -->
             <a class="alipay" href="https://qr.alipay.com/fkx13314yyiwvqakof9tle5">
-                <img src="./img/ali.png" alt="AliPay" width="200px" >
+                <img src="./img/ali.png" alt="AliPay" width="200px" class="ali">
             </a>
             <!-- WechatPay QR-code -->
-            <img src="./img/wechat.png" alt="WeChat Pay" width="200px" >
+            <img src="./img/wechat.png" alt="WeChat Pay" width="200px" class="wechat">
         </div>
         <div class="QRcode2">
             <!-- QQPay QR-code -->
-            <img id="qq" src="./img/qq.png" alt="QQPay" width="200px">
+            <img id="qq" src="./img/qq.png" alt="QQPay" width="200px" class="qq">
         </div>
         <div class="footnote">
             <hr class="footnotehr">