From 1e218dc546c47bc9dc7c2016a6a775166a40f88f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=9D=A8=E6=88=90=E8=B1=AA?= <1400383615@qq.com>
Date: Sun, 3 Nov 2024 21:23:09 +0800
Subject: [PATCH] 2024102802

---
 ...\345\255\220\345\270\203\345\261\200.html" | 145 ++++++++++++++++--
 1 file changed, 134 insertions(+), 11 deletions(-)
diff --git "a/\346\235\250\346\210\220\350\261\252/\344\275\234\344\270\232/20241028-flex\347\255\233\345\255\220\345\270\203\345\261\200.html" "b/\346\235\250\346\210\220\350\261\252/\344\275\234\344\270\232/20241028-flex\347\255\233\345\255\220\345\270\203\345\261\200.html"
index 6f01dee..13615b8 100644
--- "a/\346\235\250\346\210\220\350\261\252/\344\275\234\344\270\232/20241028-flex\347\255\233\345\255\220\345\270\203\345\261\200.html"
+++ "b/\346\235\250\346\210\220\350\261\252/\344\275\234\344\270\232/20241028-flex\347\255\233\345\255\220\345\270\203\345\261\200.html"
@@ -1,10 +1,11 @@
 <html lang="en">
+
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Document</title>
     <style>
-        .one{
+        .one {
             width: 100px;
             height: 100px;
             border: 2px solid red;
@@ -13,13 +14,18 @@
             justify-content: center;
             align-items: center;
         }
-        .round{
+
+        .round {
             width: 0;
             height: 0;
             border: 8px solid black;
             border-radius: 80%;
         }
-        .two,.three,.four{
+
+        .two,
+        .three,
+        .four,
+        .five {
             width: 100px;
             height: 100px;
             border: 2px solid red;
@@ -30,36 +36,153 @@
             justify-content: center;
             justify-content: space-around;
         }
-        .t1{
+
+        .t1 {
             margin-left: -54px;
         }
-        .t5{
+
+        .t2 {
             margin-right: -54px;
         }
 
+        .f1 {
+            width: 100px;
+            height: 50px;
+            display: flex;
+            justify-content: center;
+            justify-content: space-around;
+            align-items: center;
+        }
+
+        .f2 {
+            width: 100px;
+            height: 50px;
+            display: flex;
+            justify-content: space-around;
+            align-items: center;
+        }
+        .f2 div:nth-child(1){
+            margin-left: -18px;
+        }
+        .f2 div:nth-child(2){
+            margin-right: -18px;
+        }
     </style>
 </head>
+
 <body>
     <!-- 一点 -->
     <!-- <div class="one">
         <div class="round"></div>
     </div> -->
+
     <!-- 二点 -->
     <!-- <div class="two">
-        <div class="t1 round"></div>
-        <div class="t2 round"></div>
+        <div class="round"></div>
+        <div class="round"></div>
     </div> -->
+
     <!-- 三点 -->
     <!-- <div class="three">
         <div class="t1 round"></div>
         <div class="round"></div>
         <div class="t2 round"></div>
     </div> -->
+
+    <!-- 四点 -->
     <!-- <div class="four">
-        <div class="f1"></div>
-        <div class="f2"></div>
-        <div class="f3"></div>
-        <div class="f4"></div>
+        <div class="f1">
+            <div class="round"></div>
+            <div class="round"></div>
+        </div>
+        <div class="f1">
+            <div class="round"></div>
+            <div class="round"></div>
+        </div>
     </div> -->
+
+    <!-- 五点 -->
+    <!-- <div class="five">
+        <div class="f1">
+            <div class="round"></div>
+            <div class="round"></div>
+        </div>
+        <div class="round"></div>
+        <div class="f1">
+            <div class="round"></div>
+            <div class="round"></div>
+        </div>
+    </div> -->
+
+    <!-- 六点 -->
+    <!-- <div class="five">
+        <div class="f1">
+            <div class="round"></div>
+            <div class="round"></div>
+        </div>
+        <div class="f1">
+            <div class="round"></div>
+            <div class="round"></div>
+        </div>
+        <div class="f1">
+            <div class="round"></div>
+            <div class="round"></div>
+        </div>
+    </div> -->
+
+    <!-- 七点 -->
+    <!-- <div class="five">
+        <div class="f1">
+            <div class="round"></div>
+            <div class="round"></div>
+            <div class="round"></div>
+        </div>
+        <div class="f1">
+            <div class="round"></div>
+        </div>
+        <div class="f1">
+            <div class="round"></div>
+            <div class="round"></div>
+            <div class="round"></div>
+        </div>
+    </div> -->
+
+    <!-- 八点 -->
+    <!-- <div class="five">
+        <div class="f1">
+            <div class="round"></div>
+            <div class="round"></div>
+            <div class="round"></div>
+        </div>
+        <div class="f2">
+            <div class="round"></div>
+            <div class="round"></div>
+        </div>
+        <div class="f1">
+            <div class="round"></div>
+            <div class="round"></div>
+            <div class="round"></div>
+        </div>
+    </div> -->
+
+    <!-- 九点 -->
+      <div class="five">
+        <div class="f1">
+            <div class="round"></div>
+            <div class="round"></div>
+            <div class="round"></div>
+        </div>
+        <div class="f1">
+            <div class="round"></div>
+            <div class="round"></div>
+            <div class="round"></div>
+        </div>
+        <div class="f1">
+            <div class="round"></div>
+            <div class="round"></div>
+            <div class="round"></div>
+        </div>
+    </div>
 </body>
+
 </html>
\ No newline at end of file
-- 
Gitee

