diff --git a/homework1/README.MD b/homework1/README.MD
new file mode 100644
index 0000000..d410563
--- /dev/null
+++ b/homework1/README.MD
@@ -0,0 +1,23 @@
+# 实验一 网页开发基础
+
+## 实验目标
+
+开发一个这样的网页
+
+
+
+## 项目结构
+
+```bash
+.
+├── assets # 存放网页资源文件
+│ └── navbar # 导航栏的资源文件
+│ ├── cart.svg # 购物车图标的矢量图
+│ └── search.svg # 搜索图标的矢量图
+├── index.css
+├── index.html
+├── README.assets # README.md中的资源文件
+│ └── image-20250226153311043.png
+└── README.MD
+```
+
diff --git a/homework1/README.assets/image-20250226153311043.png b/homework1/README.assets/image-20250226153311043.png
new file mode 100644
index 0000000..25c09e9
Binary files /dev/null and b/homework1/README.assets/image-20250226153311043.png differ
diff --git a/homework1/assets/navbar/cart.svg b/homework1/assets/navbar/cart.svg
new file mode 100644
index 0000000..8dcd390
--- /dev/null
+++ b/homework1/assets/navbar/cart.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/homework1/assets/navbar/search.svg b/homework1/assets/navbar/search.svg
new file mode 100644
index 0000000..ac148af
--- /dev/null
+++ b/homework1/assets/navbar/search.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/homework1/index.css b/homework1/index.css
index 3d2ec8d..7eabb31 100644
--- a/homework1/index.css
+++ b/homework1/index.css
@@ -8,7 +8,7 @@
/* 设置导航栏样式 */
#navbar {
- background-color: rgb(49, 42, 42);
+ background-color: rgb(93, 75, 51);
width: 100%;
height: 50px;
/* 确保导航栏内对象居中 */
@@ -16,12 +16,29 @@
align-items: center;
}
+/* 设置导航栏左侧元素边距 */
+#nav_left {
+ margin-left: 10%;
+}
+
/* 设置导航栏对象样式*/
.navobj {
color: rgb(255, 255, 255);
- margin-left: 10px;
- margin-right: 10px;
- display: inline-block;
+ padding-left: 10px;
+ padding-right: 10px;
+ height: 50px;
+ display: flex;
+ align-items: center;
+ border-left: 2px;
+ border-right: 0;
+ border-top: 0;
+ border-bottom: 0;
+ border-color: rgb(107, 88, 63);
+ border-style: solid;
+}
+
+#navbar_regobj {
+ background: rgb(240, 120, 24);
}
/* 确保导航栏内的链接无蓝字和下划线 */
@@ -38,17 +55,16 @@
/* 下拉菜单按钮样式 */
.dropbtn {
- color: white;
+ color: rgb(255, 255, 255);
padding: 16px;
- font-size: 16px;
border: none;
cursor: pointer;
display: flex;
align-items: center;
}
-/* 为下拉菜单按钮添加三角箭头 */
-.dropbtn::after {
+/* 为商品分类下拉菜单按钮添加三角箭头 */
+#navbar_typeobj::after {
content: "";
border-left: 5px solid transparent;
border-right: 5px solid transparent;
@@ -60,7 +76,7 @@
.dropdown-content {
display: none;
position: absolute;
- background-color: rgb(49, 42, 42);
+ background-color: rgb(93, 75, 51);
min-width: 160px;
box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
z-index: 1;
@@ -76,7 +92,7 @@
/* 鼠标悬停时下拉菜单内容链接样式 */
.dropdown-content a:hover {
- background-color: #8187db;
+ background-color: rgb(240, 120, 24);
}
/* 鼠标悬停时显示下拉菜单内容 */
diff --git a/homework1/index.html b/homework1/index.html
index 43f2ace..631184b 100644
--- a/homework1/index.html
+++ b/homework1/index.html
@@ -12,22 +12,32 @@