/* * ========================================== * 模块定位：全局核心容器边界 (Core Container Boundary) - 移动端安全内边距 * 代码类型：CSS * ========================================== * 1. 业务功能：重构移动端 (<=768px) 物理安全边界，设定 15px 上下内边距及 8px 左右内边距。 * 2. 修复与 SEO 优化：严格遵循 GeneratePress 响应式断点；利用 `body` 标签提权进行样式覆盖，彻底摒弃破坏层叠上下文的 `!important` 声明，降低浏览器 Recalculate Style 耗时，优化移动端渲染性能。 * 3. 针对页面：全局移动端视图 (Mobile View) * 4. 性能开销：0 ms (纯 CSS 级渲染，无 DOM 重排) * * 最后修改：2026-03-19 16:24 (UTC+8) - 底层架构级重构 */ @media (max-width: 768px) { /* 提升选择器权重，利用 body 标签实现优雅覆盖，坚决拒绝 !important */ body.separate-containers .inside-article { padding: 15px 8px; } } /* ----------逻辑结束---------- */ /* * ========================================== * 模块定位：全局基础架构 - GP 核心容器视觉边界 * 代码类型：CSS * ========================================== * 1. 业务功能：统一规范 GeneratePress 主体文章区、侧边栏小工具及评论面板的阴影与边框呈现。 * 2. 修复与 SEO 优化：复用原生类名以贯彻零 DOM 注入原则。精简层级，确保不阻塞首屏渲染，符合 Core Web Vitals 极致要求。 * 3. 针对页面：全局生效 (涵盖所有生成 .inside-article 与 .widget 的标准模板视图) * 4. 性能开销：约 <0.1 ms (纯净 CSS 规则树极速匹配) * * 最后修改：2026-03-19 16:26 (UTC+8) - 底层架构级重构 */ /* 拦截 GP 原生核心容器，施加硬件级友好样式 */ .inside-article, .sidebar .widget, .comments-area, .container-widget { /* 物理边界固化，避免尺寸动态计算导致的重排 */ border-right: 2px solid rgba(0, 0, 0, 0.07); border-bottom: 2px solid rgba(0, 0, 0, 0.07); /* 阴影层级扁平化，控制 Paint 阶段 GPU 开销 */ box-shadow: 0 0 10px rgba(232, 234, 237, 0.5); } /* ----------逻辑结束---------- */ /* ======================================================== 彻底消除 GeneratePress 主容器 (#page) 在手机端的顶部隔离带 修复海报/面包屑与正文之间的红框虚空 ======================================================== */ @media (max-width: 768px) { /* 1. 狙击主容器：干掉推开海报的默认外边距 */ #page.site { margin-top: 0 !important; } /* 2. 狙击分离模式：干掉正文区域的默认外边距 */ body.separate-containers .site-main { margin-top: 0 !important; } /* 3. 面包屑防御：收起面包屑自带的外边距 */ .mx-breadcrumb { margin-top: 0 !important; margin-bottom: 0 !important; } /* 4. 智能折叠：如果某些页面没有面包屑内容，强行将这个空盒子折叠，防止它占高度 */ .mx-breadcrumb:empty { display: none !important; padding: 0 !important; height: 0 !important; } /* 5. 防外边距溢出：解决上一轮“红框变高”的元凶，干掉内部第一个元素的顶边距 */ .site-content > .content-area > .site-main > article > .inside-article > *:first-child { margin-top: 0 !important; } } /* ----------逻辑结束---------- */ @media (max-width: 768px) { /* ======================================================== GeneratePress 移动端底层容器：终极合并清理方案 (全覆盖版) 包含：常规页面、文章页、产品单页及上下篇导航断层修复 ======================================================== */ /* 第一层共通：斩断内容白框 (inside-article) 的底部留白和阴影 */ .inside-article:has( .mx-about-wrapper, .mx-app-container, .mx-download-content-wrapper, .mx-faq-expanded-container, .mx-contact-wrapper, .mx-downloads-matrix-wrapper, .mx-product-container, /* 已修正为产品单页实际类名 */ .mx-page-tags-wrapper ), body.single-post .inside-article, body.single-product .inside-article, /* 纳入产品单页 */ body.page .inside-article { padding-bottom: 0 !important; margin-bottom: 0 !important; box-shadow: none !important; border-bottom: none !important; } /* 👇 斩断 GP 主题最外层容器的默认底部间距 */ body.page .site-content, body.page .site-main, body.page .content-area, body.single-product .site-content, body.single-product .site-main, body.single-product .content-area { padding-bottom: 0 !important; margin-bottom: 0 !important; } /* 第二层特化：针对全屏/宽屏矩阵模块，强行剥夺主题容器的背景色和所有内边距 */ .inside-article:has( .mx-about-wrapper, .mx-app-container, .mx-faq-expanded-container, .mx-contact-wrapper, .mx-downloads-matrix-wrapper, .mx-product-container ) { background-color: transparent !important; padding: 0 !important; border: none !important; } /* 附带：独立的“上下篇导航”组件底部间距归零，与 Footer 完美融合 */ .mx-post-navigation { margin-bottom: 0 !important; padding-bottom: 20px !important; border-bottom: none !important; margin-top: 0 !important; /* 新增：双重保险，防止顶部断层 */ } /* ======================================================== 👇 终极修复：解决
底部 20px 灰色断层 (导航栏上方灰缝真凶) ======================================================== */ body.single-product .site-main > article.product, body.single-post .site-main > article, body.page .site-main > article { margin-bottom: 0 !important; } /* ======================================================== 👇 解决常规页面（如隐私页）及产品单页底部与页脚之间的灰条透出问题 ======================================================== */ /* 1. 斩断 GeneratePress 分离容器模式下，页脚自带的顶部灰色间距 */ body.page.separate-containers .site-footer, body.single-product.separate-containers .site-footer { margin-top: 0 !important; } /* 2. 清除内容区最后元素的底部外边距，防止 Margin 塌陷撑出灰条 */ body.page .inside-article .entry-content > *:last-child, body.single-product .inside-article .entry-content > *:last-child { margin-bottom: 0 !important; } /* 3. 终极补刀：斩断最后一个列表项 (li) 自带的 10px 顽固边距泄漏 */ body.page .inside-article .entry-content > *:last-child > li:last-child, body.single-product .inside-article .entry-content > *:last-child > li:last-child { margin-bottom: 0 !important; } /* 4. 恢复正常的底部内部留白（保持白底），让文字不至于紧贴页脚 */ body.page .inside-article .entry-content, body.single-product .inside-article .entry-content { padding-bottom: 20px !important; } /* 5. 针对带有全屏背景的特殊组件，强行剥夺这 20px 的留白 */ body.page .inside-article:has(.mx-contact-wrapper, .mx-about-wrapper, .mx-product-container, .mx-downloads-matrix-wrapper) .entry-content, body.single-product .inside-article:has(.mx-product-container) .entry-content { padding-bottom: 0 !important; } } /* ----------逻辑结束---------- */ /* ======================================================== 彻底消除 MX 子导航 (About Sub-Navigation) 与正文之间的红框虚空 参考目标: image_9cbeb7.jpg ======================================================== */ /* 1. 斩断 GeneratePress 对