diff --git "a/\351\273\204\345\277\203\351\222\260/2021.11.29 \345\223\215\345\272\224\345\274\217\350\256\276\350\256\241\345\260\217\350\257\264/\345\260\217\350\257\264\351\241\265\351\235\242PC\347\253\257.html" "b/\351\273\204\345\277\203\351\222\260/2021.11.29 \345\223\215\345\272\224\345\274\217\350\256\276\350\256\241\345\260\217\350\257\264/\345\260\217\350\257\264\351\241\265\351\235\242PC\347\253\257.html"
new file mode 100644
index 0000000000000000000000000000000000000000..de3e5096a2ad62c81025de08597aa310ac0e3dca
--- /dev/null
+++ "b/\351\273\204\345\277\203\351\222\260/2021.11.29 \345\223\215\345\272\224\345\274\217\350\256\276\350\256\241\345\260\217\350\257\264/\345\260\217\350\257\264\351\241\265\351\235\242PC\347\253\257.html"	
@@ -0,0 +1,113 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+    <style>
+        .top{
+            background-color: antiquewhite;
+            border: 1px solid black;
+            height: 30px;
+        }
+        #one-color{
+            background-color: blue;
+            height: 15px;
+            border-radius: 10px;
+        }
+        #two-color{
+            background-color: white;
+            height: 15px;
+            border-radius: 10px;
+        }
+        #three-color{
+            background-color: greenyellow;
+            height: 15px;
+            border-radius: 10px;
+        }
+        #four-color{
+            background-color: brown;
+            height: 15px;
+            border-radius: 10px;
+        }
+        #five-color{
+            background-color: purple;
+            height: 15px;
+            border-radius: 10px;
+        }
+        #fix-color{
+            background-color: red;
+            height: 15px;
+            border-radius: 10px;
+        }
+        #seven-color{
+            background-color: greenyellow;
+            height: 15px;
+            border-radius: 10px;
+        }
+        #eight-color{
+            background-color: gainsboro;
+            height: 15px;
+            border-radius: 10px;
+        }
+        .certen{
+            border: 1px solid black;
+            background-color: antiquewhite;
+            height: 900px;
+        }
+        .certen a{
+            margin:  565px;
+            font-size: 20px;
+        }
+        p{
+            margin: 25px 450px;
+            text-indent: 2em;
+        }
+        .xian{
+            height: 2px;
+            background-color: skyblue;
+        }
+    </style>
+</head>
+<body>
+    <div class="lu">
+        <div class="top">
+            <a style="font-size: 10px;"><b>选择背景颜色：</a>
+            <input type="button" id="one-color" value="">
+            <input type="button" id="two-color" value="">
+            <input type="button" id="three-color" value="">
+            <input type="button" id="four-color" value="">
+            <input type="button" id="five-color" value="">
+            <input type="button" id="fix-color" value="">
+            <input type="button" id="seven-color" value="">
+            <input type="button" id="eight-color" value="">
+
+            <a style="font-size: 10px; margin: 15px;"><b>选择字号：</a>
+            <u style="font-size: 7px;"> 特大</u>
+            <u style="font-size: 7px;"> 大</u>
+            <u style="font-size: 7px;"> 中</u>
+            <u style="font-size: 7px;"> 小</u>
+            <input type="button" value="全屏阅读" style="background-color: khaki; margin: 5px 0 0 410px;">
+            <input type="button" value="评论本章" style="background-color: skyblue;">
+            <input type="button" value="返回目录" style="background-color: skyblue;">
+            <input type="button" value="+书架" style="background-color: skyblue;">
+            <input type="button" value="上一章" style="background-color: skyblue;">
+            <input type="button" value="下一章" style="background-color: skyblue;">
+        </div>
+        <div class="xian"></div>
+
+        <div class="certen">
+            <a>第一章 卧 龙</a>
+            <p>初平元年，襄阳，晴空万里。</p>
+            <p> 通往汉水岸边望江亭的大道上，一辆辆的马车络绎不绝，一名名世家子弟们鲜衣怒马，意气风发。</p>
+            <p>铛铛铛~~</p>
+            <p> 清脆的铜铃声响起，华*马丛中，却出现了一辆寒酸的驴车。</p>
+            <p>颠簸的驴车，陈旧的布衣，穿行在周围的鲜衣怒马之中，显的颇为扎眼。</p>
+            <p>那些经过的世族子弟们，看向那少年的眼神中，不禁都掠过一丝轻视，甚至是嫌弃的目光。</p>
+            <p>驴车上的少年，却旁若无人，手托着腮帮子，悠哉的斜卧在驴车上，嘴里哼着不知名的小曲，不时的往嘴里扔几颗蚕豆，一副旁若无人的样子。</p>
+            <p>“公子，我听说那刘荆州的这个什么招贤会，说是要唯才是举，挑选有才华的年轻人去新得的南阳郡当县令，其实早就内定了四大家族的子弟，咱还有必要大老远的白跑一趟么？”</p>
+            <p>赶车的婢女苏小小嘟着小嘴，说起话来吧嗒吧嗒，伶俐的紧，愤愤不平的向身后的布衣公子抱怨。</p>
+        </div>
+    </div>
+</body>
+</html>
\ No newline at end of file
diff --git "a/\351\273\204\345\277\203\351\222\260/2021.11.29 \345\223\215\345\272\224\345\274\217\350\256\276\350\256\241\345\260\217\350\257\264/\345\260\217\350\257\264\351\241\265\351\235\242\347\247\273\345\212\250\347\253\257.html" "b/\351\273\204\345\277\203\351\222\260/2021.11.29 \345\223\215\345\272\224\345\274\217\350\256\276\350\256\241\345\260\217\350\257\264/\345\260\217\350\257\264\351\241\265\351\235\242\347\247\273\345\212\250\347\253\257.html"
new file mode 100644
index 0000000000000000000000000000000000000000..56efbdba61ff12f90f864930b9a85eac0259666d
--- /dev/null
+++ "b/\351\273\204\345\277\203\351\222\260/2021.11.29 \345\223\215\345\272\224\345\274\217\350\256\276\350\256\241\345\260\217\350\257\264/\345\260\217\350\257\264\351\241\265\351\235\242\347\247\273\345\212\250\347\253\257.html"	
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+</head>
+<body>
+    
+</body>
+</html>
\ No newline at end of file
diff --git "a/\351\273\204\345\277\203\351\222\260/2021.12.1 SVG/\347\224\273\345\233\276.html" "b/\351\273\204\345\277\203\351\222\260/2021.12.1 SVG/\347\224\273\345\233\276.html"
new file mode 100644
index 0000000000000000000000000000000000000000..66800aa47134e4c48fffb5ed7ed58f263d45e782
--- /dev/null
+++ "b/\351\273\204\345\277\203\351\222\260/2021.12.1 SVG/\347\224\273\345\233\276.html"	
@@ -0,0 +1,23 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+</head>
+<body>
+    <svg width = "300" height = "300">
+		<polyline points = "30,50 50,30 70,50"></polyline>
+		<polyline points = "70,50 90,30 110,50"></polyline>
+		<polyline points = "110,50 130,30 150,50"></polyline>
+        <rect x = "0" y = "50" height = "175" width = "175" rx = "20" ry = "20" style="stroke: black; fill:white"></rect>
+		<circle cx = "50" cy = "100" r = "20" fill = "none" stroke = "black"></circle>
+		<circle cx = "130" cy = "100" r = "20" fill = "none" stroke = "black"></circle>
+		<circle cx = "60" cy = "110" r = "5"></circle>
+		<circle cx = "140" cy = "110" r = "5"></circle>
+		<polyline points = "79,170 89,150 99,170 79,170" fill = "white" stroke = "black"></polyline>
+		<ellipse cx = "90" cy = "195" ry = "15" rx = "30" stroke = "black" fill = "white" ></ellipse>
+	</svg>
+		
+</body>
+</html>
\ No newline at end of file
diff --git "a/\351\273\204\345\277\203\351\222\260/2021.12.2 H5\350\241\250\345\215\225\345\205\203\347\264\240/\350\241\250\345\215\225\347\275\221\351\241\265.html" "b/\351\273\204\345\277\203\351\222\260/2021.12.2 H5\350\241\250\345\215\225\345\205\203\347\264\240/\350\241\250\345\215\225\347\275\221\351\241\265.html"
new file mode 100644
index 0000000000000000000000000000000000000000..ab1649ba43637dfbecab96441b02de0e11a43e7e
--- /dev/null
+++ "b/\351\273\204\345\277\203\351\222\260/2021.12.2 H5\350\241\250\345\215\225\345\205\203\347\264\240/\350\241\250\345\215\225\347\275\221\351\241\265.html"	
@@ -0,0 +1,63 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+    <style>
+        #h{
+            margin: 30px auto;
+            width: 600px;
+        }
+        #lu{
+            line-height: 20px;
+        }
+        #han{
+            line-height: 15px;
+            color: darkblue;
+        }
+        #exo{
+            line-height: 10px;
+            color: mediumpurple;
+            font-style: italic;
+        }
+        input {
+            margin: 10px;
+        }
+        a{
+            margin: 60px;
+        }
+    </style>
+</head>
+<body>
+    <div id="h">
+    <div id="lu">
+        <h2 id="han">A Simple Form</h2>
+        <h4 id="exo">Form Fundamentals</h4>
+    </div>
+    <form autocomplete="on">
+        <fieldset>
+            <legend> Customer Info</legend>
+            <a> 用户名:<input type="text" name="username" placeholder="请输入用户名" style="width: 200px;"><br></a>
+            <a> 电话号码:<input type="tel" placeholder="例如:1-234-567-8910" style="width: 200px;" autocomplete="off" ><br></a>
+            <a> 邮箱地址:<input type="email" placeholder="请输入你的邮箱地址" style="width: 220px;" autocomplete="off"></a>
+        </fieldset>
+
+        <fieldset>
+            <legend>Books</legend>
+            <input list="books" style="width: 200px;">
+            <datalist id="books">
+                <option value="Internet Explorer"></option>
+                <option value="Firefox"></option>
+                <option value="Chrome"></option>
+                <option value="Opera"></option>
+                <option value="Safari"></option>
+            </datalist>
+            量(最大值5)：<input type="number" min="1" max="5" style="width: 200px">
+        </fieldset>
+        <input type="submit" >
+        <p style="font-size: 12px; margin: 5px 0 0 40px;">© 2011 Acme United All righhts resered</p>
+    </form>
+</div>
+</body>
+</html>
\ No newline at end of file
