diff --git a/LiDongyu-2020302687/image/360-icon.png b/LiDongyu-2020302687/image/360-icon.png
new file mode 100644
index 0000000000000000000000000000000000000000..bb0819cd7b3a5bc3612d54c16ff6a69fd05af058
Binary files /dev/null and b/LiDongyu-2020302687/image/360-icon.png differ
diff --git a/LiDongyu-2020302687/image/background1.jpg b/LiDongyu-2020302687/image/background1.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..9b1044823a793d8f8e152aeffb380b369ebfcb29
Binary files /dev/null and b/LiDongyu-2020302687/image/background1.jpg differ
diff --git a/LiDongyu-2020302687/image/background2.png b/LiDongyu-2020302687/image/background2.png
new file mode 100644
index 0000000000000000000000000000000000000000..6eb67b67485e16540906b7f81aaf59730e02e6da
Binary files /dev/null and b/LiDongyu-2020302687/image/background2.png differ
diff --git a/LiDongyu-2020302687/image/chrome-icon.png b/LiDongyu-2020302687/image/chrome-icon.png
new file mode 100644
index 0000000000000000000000000000000000000000..16c595d203116c2ec236d12495c5e8c79e85bc08
Binary files /dev/null and b/LiDongyu-2020302687/image/chrome-icon.png differ
diff --git a/LiDongyu-2020302687/image/ie-icon.png b/LiDongyu-2020302687/image/ie-icon.png
new file mode 100644
index 0000000000000000000000000000000000000000..68c95632fca4fac0fc312bbd929ad6fe2d271ed8
Binary files /dev/null and b/LiDongyu-2020302687/image/ie-icon.png differ
diff --git a/LiDongyu-2020302687/image/qq.png b/LiDongyu-2020302687/image/qq.png
new file mode 100644
index 0000000000000000000000000000000000000000..b7e94f764c9ed7611f219dc313b5bf840d81d4af
Binary files /dev/null and b/LiDongyu-2020302687/image/qq.png differ
diff --git a/LiDongyu-2020302687/image/text1.png b/LiDongyu-2020302687/image/text1.png
new file mode 100644
index 0000000000000000000000000000000000000000..02817924de89f27392eab7b9fadbf2578634f842
Binary files /dev/null and b/LiDongyu-2020302687/image/text1.png differ
diff --git a/LiDongyu-2020302687/image/title1.png b/LiDongyu-2020302687/image/title1.png
new file mode 100644
index 0000000000000000000000000000000000000000..0213b431711bc82882ae2022cc1de7831579840c
Binary files /dev/null and b/LiDongyu-2020302687/image/title1.png differ
diff --git a/LiDongyu-2020302687/image/wechat.png b/LiDongyu-2020302687/image/wechat.png
new file mode 100644
index 0000000000000000000000000000000000000000..32ba70bbc3e47efc9da4244b0ac53e23f7996d02
Binary files /dev/null and b/LiDongyu-2020302687/image/wechat.png differ
diff --git a/LiDongyu-2020302687/lab1.html b/LiDongyu-2020302687/lab1.html
new file mode 100644
index 0000000000000000000000000000000000000000..d67d6486a08c2f54a1e6b417c7e659c110048284
--- /dev/null
+++ b/LiDongyu-2020302687/lab1.html
@@ -0,0 +1,108 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+    <meta charset="UTF-8">
+    <title>ģ�µ�¼���� | lab1</title>
+
+    <style type="text/css">
+        .style1 {
+            color: #843C0C;
+            font-family: "Microsoft YaHei UI";
+            font-size: small;
+            letter-spacing: 1pt;
+        }
+    </style>
+</head>
+
+
+
+<body>
+
+    <img src="image/background1.jpg" width="1520" height="780" />
+
+    <div style="position: absolute; width: 1520px; height:450px; z-index: 8; left: -0px; top: 170px" id="backgroud" class="style1">
+        <img src="image/background2.png" width="1520" height="450" />
+    </div>
+
+    <div style="position: absolute; width: 1520px; height:120px; z-index: 8; left: -0px; top: 70px" id="backgroud" class="style1">
+        <img src="image/title1.png" width="780" height="130" />
+    </div>
+
+    <div style="position: absolute; width: 400px; height:450px; z-index: 8; left: 0px; top: 170px" id="picture1" class="style1">
+        <img src="image/text1.png" width="370" height="450" />
+    </div>
+
+    <div style="position: absolute; width: 400px; height:450px; z-index: 8; left: 1120px; top: 170px" id="picture2" class="style1">
+        <img src="image/text1.png" width="400" height="450" />
+    </div>
+
+    <div style="position: absolute; width: 360px; height:410px; z-index: 8; left: 1140px; top: 190px" id="text-in-p2" class="style1">
+
+        <details>
+            <summary>Account password login</summary>
+            <form>
+                Username: <input type="text" name="firstname" style="width: 260px; height:30px" /><br>
+                Password: <input type="password" name="pwd" style="width: 260px; height:30px" /><br>
+                <br><br>
+                <input name="Checkbox1" type="checkbox" />
+                <span>remember the password?</span>
+                <br><br>
+                <button name="Abutton1" style="height: 50px; width: 100px">
+                    <span class="style1">forget the password?</span>
+                </button>
+                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
+                <button name="Abutton2" style="height: 50px; width: 100px">
+                    <span class="style1">Login</span>
+                </button>
+            </form>
+        </details>
+
+        <details>
+            <summary>Mobile dynamic code login</summary>
+            <form>
+                PhoneNumber: <input type="text" name="firstname" style="width: 200px; height:30px" /><br>
+                DynamicCode: <input type="password" name="pwd" style="width: 120px; height:50px" />
+                <button name="Abutton3" style="height: 50px; width: 80px">
+                    <span class="style4">sent dynamic code</span>
+                </button>
+                <br><br><br>
+
+                <button name="Abutton4" style="height: 50px; width: 100px">
+                    <span class="style1">Login</span>
+                </button>
+            </form>
+        </details>
+
+    </div>
+
+    <div style="position: absolute; width: 788px; height: 100px; z-index: 6; left: 14px; top: 670px; visibility: visible;" id="layer4" class="style3">
+        <form method="post">
+            <button name="Abutton1" style="height: 24px; width: 178px">
+                <span class="style1">one</span>
+            </button>
+            <button name="Abutton2" style="height: 24px; width: 178px">
+                <span class="style1">two</span>
+            </button>
+            <button name="Abutton3" style="height: 24px; width: 178px">
+                <span class="style1">three</span>
+            </button>
+            <button name="Abutton4" style="height: 24px; width: 178px">
+                <span class="style1">four</span>
+            </button><br />
+            <br />
+            <span class="style1">
+                StudentNumber: 2020302687&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
+                QQ: 484180159&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
+                E-mail: plumer1215@163.com
+            </span>
+        </form>
+    </div>
+
+    <div style="position: absolute; width: 255px; height: 4px; z-index: 10; left: 1207px; top: 718px" id="layer7" class="style10">
+        Suggested browser: &nbsp;&nbsp;&nbsp;
+        <img src="image/360-icon.png" width="16" height="16" />&nbsp;
+        <img src="image/chrome-icon.png" width="16" height="16" />&nbsp;
+        <img src="image/ie-icon.png" width="16" height="16" />
+    </div>
+</body>
+</html>
