From f7cca2d5a76708335b84548177f929415bb25192 Mon Sep 17 00:00:00 2001
From: jack <251108449@qq.com>
Date: Thu, 16 Jul 2026 15:44:30 +0800
Subject: [PATCH] =?UTF-8?q?=E6=A0=B7=E5=BC=8F=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/withmind/assets/index.rem.css | 32 +++++++++++--------------
 src/views/withmind/index.vue            | 11 +++------
 2 files changed, 17 insertions(+), 26 deletions(-)

diff --git a/src/views/withmind/assets/index.rem.css b/src/views/withmind/assets/index.rem.css
index e8c79b9..11efd19 100644
--- a/src/views/withmind/assets/index.rem.css
+++ b/src/views/withmind/assets/index.rem.css
@@ -3,19 +3,18 @@ html {
 }
 
 body {
-  /* 不需要 min-height 了,.page 用 relative 不会脱离文档流 */
+  /* .page 用 relative 不脱离文档流,不需要 body 撑滚动 */
   margin: 0;
 }
 
 .page {
   background-color: rgba(255, 255, 255, 1);
-  /* 响应式居中:width 100% + max-width 51.2rem + margin: 0 auto
-     视口 >= 1920: .page 占满 1920 居中
-     视口 < 1920: .page 跟着视口收缩,小屏也能完整看到内容(可能有横向滚动条) */
+  /* 整体居中:用 relative + left: 50% + margin-left: -25.6rem (-page 宽度一半)
+     .page 真正在视口中央居中,内容在 .page 内的左边距由内容自己控制 */
   position: relative;
-  width: 100%;
-  max-width: 51.2rem;
-  margin: 0 auto;
+  left: 50%;
+  margin-left: -25.6rem;
+  width: 51.2rem;
   /* 改用 min-height:页面跟内容自适应,后续插入任何板块不会被 page 高度裁掉。
      152.4rem 是历史基线高度,内容多了 page 会自动撑开。 */
   min-height: 152.4rem;
@@ -34,26 +33,23 @@ body {
 .section_1 {
   width: 51.2rem;
   height: 60.054rem;
-  /* .section_2 浮起来后,给 section_1 加 padding-top 防止 logo 被覆盖 */
   padding-top: 2.134rem;
   box-sizing: border-box;
 }
 
 .section_2 {
   background-color: rgba(255, 255, 255, 0.95);
-  /* 用 fixed 锁定顶部:fixed 相对 viewport 定位,不受任何父链影响 */
+  /* 导航条锁定顶部:fixed + top: 0
+     居中:用 absolute + left: 50% + margin-left: -25.6rem 跟 .page 同步 (.page 真居中) */
   position: fixed;
   top: 0;
-  left: 0;
-  right: 0;
-  /* 居中:用 margin: 0 auto (fixed 元素也支持 auto margin),
-     width 100% + max-width 51.2rem 跟 .page 同步 */
-  margin: 0 auto;
+  left: 50%;
+  margin-left: -25.6rem;
   z-index: 1000;
-  width: 100%;
-  max-width: 51.2rem;
+  width: 51.2rem;
   height: 2.134rem;
-  border: 1px solid rgba(239, 239, 239, 1);
+  /* 边框去掉,让导航条和页面背景融为一体 */
+  border: none;
 }
 
 /* group_2 / box_1 / section_3 / section_4 / box_2 已删除：左上角 logo 改用 image_1 整张合并图（Slice 3.png） */
@@ -61,7 +57,7 @@ body {
 .image_1 {
   width: 6.347rem;
   height: 0.854rem;
-  margin: 0.64rem 0 0 7.067rem;
+  margin: 0.64rem 0 0 6.934rem;
   display: block;
   object-fit: contain;
 }
diff --git a/src/views/withmind/index.vue b/src/views/withmind/index.vue
index 128e38e..5814fd9 100644
--- a/src/views/withmind/index.vue
+++ b/src/views/withmind/index.vue
@@ -770,14 +770,9 @@ export default {
 </script>
 <style scoped lang="css" src="./assets/index.rem.css" />
 <style scoped>
-.section_2 {
-  position: fixed;
-  top: 0;
-  left: 0;
-  z-index: 100;
-  will-change: transform;
-  transform: translateZ(0);
-}
+/* 2026-07-16: 删掉这里的 .section_2 规则（position: fixed; left: 0; transform: translateZ(0)）,
+   它覆盖了 index.rem.css 里的 left: 50%; margin-left: -22.133rem 居中规则,
+   导致导航条定位在视口左上角偏左。居中规则全部在 index.rem.css 里。 */
 .section_1 {
   margin-top: 2.133rem;
 }