From 2d9f7390c5bdc769eee51f7a697ac7c9e8a395c1 Mon Sep 17 00:00:00 2001 From: linbin <495561397@qq.com> Date: Sat, 6 Sep 2025 13:34:32 +0800 Subject: [PATCH] =?UTF-8?q?=E7=BB=BC=E8=BF=B0:=20=E4=BC=98=E5=8C=96iframe?= =?UTF-8?q?=E5=86=85=E5=AE=B9=E6=98=BE=E7=A4=BA=EF=BC=8C=E5=AE=9E=E7=8E=B0?= =?UTF-8?q?=E6=97=A0=E7=BC=9D=E5=85=A8=E5=B1=8F=E6=95=88=E6=9E=9C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 添加CLAUDE.md文件定义IFRAME嵌入页面样式规范 - 在index.html中为iframe内容注入通用全屏样式 - 确保所有通过iframe嵌入的页面顶格显示无边距空白 - 优化内容区域显示逻辑和页面结构 这些修改遵循了CLAUDE.md中定义的样式规范，确保iframe嵌入页面能够全屏显示。 --- 商家端web/CLAUDE.md | 52 +++++ 商家端web/index.html | 515 +++++++++++++++++++++++++++++++++++++++++++ 2 files changed, 567 insertions(+) create mode 100644 商家端web/CLAUDE.md create mode 100644 商家端web/index.html diff --git a/商家端web/CLAUDE.md b/商家端web/CLAUDE.md new file mode 100644 index 0000000..7bc978c --- /dev/null +++ b/商家端web/CLAUDE.md @@ -0,0 +1,52 @@ +## IFRAME嵌入页面样式规范 +═══════════════════════ + +为确保所有通过iframe嵌入的页面都能顶格显示（无边距、无空白），所有嵌入页面必须遵循以下CSS样式规范： + +### 必须修改的样式： + +1. **body标签样式**： + ```css + body { + margin: 0 !important; + padding: 0 !important; + } + ``` + +2. **容器样式（.container或主容器）**： + ```css + .container { + width: 100% !important; + height: 100vh !important; + margin: 0 !important; + padding: 0 !important; + max-width: none !important; + border-radius: 0 !important; + box-shadow: none !important; + } + ``` + +3. **响应式设计**： + ```css + @media (max-width: 768px) { + .container { + margin: 0 !important; + border-radius: 0 !important; + } + } + ``` + +### 修改清单： +- [ ] 移除body的padding +- [ ] 将max-width改为width: 100% +- [ ] 将margin: 0 auto改为margin: 0 +- [ ] 移除border-radius和box-shadow +- [ ] 确保高度为100vh +- [ ] 检查响应式样式 + +### 适用范围： +- 权限管理模块所有页面 +- 产品管理模块所有页面 +- 用户管理模块所有页面 +- 系统设置模块所有页面 +- 所有未来新增的iframe嵌入页面 \ No newline at end of file diff --git a/商家端web/index.html b/商家端web/index.html new file mode 100644 index 0000000..cf5a9b8 --- /dev/null +++ b/商家端web/index.html @@ -0,0 +1,515 @@ + + + + + + 大妈系统平台 + + + + +
+
+

大妈系统平台

+
+ +
+ + +
+
+

欢迎使用大妈系统平台

+
+
+
+

系统介绍

+

这是一个简洁美观的大妈系统平台，左侧是多级导航菜单，右侧是内容展示区域。您可以点击左侧菜单浏览不同的内容板块。

+

系统支持响应式设计，在不同设备上都能提供良好的用户体验。

+
+
+

功能特点

+

1. 多级菜单结构：支持无限层级的菜单分类

+

2. 展开收起功能：点击箭头可展开或收起子菜单

+

3. 响应式设计：适配不同屏幕尺寸的设备

+

4. 美观界面：现代化的设计风格，提供良好的视觉体验

+
+
+

使用说明

+

点击左侧菜单项可以展开或收起子菜单。

+

在移动设备上，菜单会自动折叠以节省空间。

+

内容区域会根据选择的菜单项显示相应的内容。

+
+
+
+ + + + \ No newline at end of file