归档：完成实验一导航栏

2025-02-26 16:47:42 +08:00
parent c3d906548b
commit ed02926908
3 changed files with 44 additions and 2 deletions
@@ -12,7 +12,7 @@
    <!--导航栏-->
    <div id="navbar">
      <!--导航栏左侧对象-->
-      <div id="nav_left" style="display: flex">
+      <div id="nav_left">
        <div class="navobj">
          <a href="#">首页</a>
        </div>
@@ -38,6 +38,28 @@
          <a href="#">登录</a>
        </div>
      </div>
+      <!--导航栏右侧对象-->
+      <div id="nav_right" style="display: flex">
+        <!--搜索按钮-->
+        <div class="navobj dropdown">
+          <!--搜索下拉菜单-->
+          <a href="#" class="dropbtn" id="nav_search_svg"
+            ><img src="assets/navbar/search.svg" alt="搜索" class="nav_svg"
+          /></a>
+          <div class="dropdown-content">
+            <form action="#" style="display: flex">
+              <input type="text" />
+              <button type="submit">搜索</button>
+            </form>
+          </div>
+        </div>
+        <!--购物车按钮-->
+        <div class="navobj">
+          <a href="#">
+            <img src="assets/navbar/cart.svg" alt="购物车" class="nav_svg" />
+          </a>
+        </div>
+      </div>
    </div>
  </body>
 </html>