From 8c0f42b90ea030b66d3cda75c10bb58ec703f77c Mon Sep 17 00:00:00 2001 From: yiqiu Date: Wed, 18 Mar 2026 19:41:58 +0800 Subject: [PATCH] =?UTF-8?q?fix+refactor:=20=E4=B8=8B=E6=8B=89=E9=9D=A2?= =?UTF-8?q?=E6=9D=BF=E5=B7=A6=E5=8F=B3=E6=94=B6=E8=B5=B7=20+=20About=20?= =?UTF-8?q?=E9=A1=B5=E9=9D=A2=E5=A4=A7=E5=B9=85=E7=B2=BE=E7=AE=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 下拉面板修复: - .nav-cont 加 pointer-events:none 让全宽空白区不拦截鼠标 - .nav-cont-menu 加 pointer-events:auto 只有内容区可交互 - 加 .nav-shadow mouseleave 监听兜底 About 精简: - 7 section → 5 section (去掉关于我们长文、客户案例) - 核心优势 6 项 → 3 项 SVG 图标卡片 - 时间轴去掉段落描述只保留标题 - CTA 精简为一行描述 + 按钮 --- about.html | 167 +++---------- css/about.css | 535 +++++++++--------------------------------- css/nav-mega-menu.css | 3 +- 3 files changed, 149 insertions(+), 556 deletions(-) diff --git a/about.html b/about.html index cc1f93a..4e2f6a8 100644 --- a/about.html +++ b/about.html @@ -10,16 +10,16 @@
{include file="public/header"}
- +
ABOUT US

主题云

-

助力中小企业数智化转型升级

+

专业的全球云产品服务供应商，助力中小企业数智化转型升级

- 10年 + 10年+ 行业经验
@@ -35,119 +35,58 @@
800G - 全球带宽容量 + 全球带宽
- -
-
-
-
-

关于主题云

-
-

主题云，隶属于xxxx科技有限公司，专业的全球云产品服务供应商，提供公有云、私有云、专属云、混合云的全栈式云产品服务矩阵，融合数智化前沿科技，为电商、金融、医疗、教育、文旅等行业领域提供丰富的数字化解决方案。

-

主题云深耕基础云计算领域，始终秉持高性价比、高定制化、高性能的产品服务理念，保持中立服务立场，伴随着基础设施的加速投入与深入布局，主题云将为广大用户提供更优质的云产品与服务体验，为各行各业的云上业务保驾护航。

-
-
-
-
- -
-

全栈云服务

-

公有云 · 私有云 · 混合云

-
-
-
- -
-

全球覆盖

-

20+ 地区 · 60+ 可用区

-
-
-
- -
-

安全可信

-

T级防御 · 99.99% 可用性

-
-
-
- -
-

专属服务

-

7×24 小时全天候支持

-
-
-
-
-
- - +
-
-

为什么选择主题云

-

我们以客户为中心，以创新为驱动，为您提供值得信赖的云服务

-
-
+
-
01
+
+ +

安全可信

-

"五位一体"安全监管体系，基础设施符合国际严格标准认证，电力、网络可用性达 99.99%，有效保证所有设备稳定运行。

+

国际标准认证，99.99% 可用性

-
02
-

高效服务

-

7×24 小时全天候服务保障，通过多元服务渠道为您提供上云业务全生命周期的无忧服务，为您的云上业务全程护航。

+
+ +
+

全球覆盖

+

20+ 地区，60+ 可用区

-
03
-

自主研发

-

坚持自主研发，产品体系完善，为各行各业提供高性能、高可用、高弹性、高性价比的云计算框架与服务。

-
-
-
04
-

定制服务

-

资深售前架构师，拥有丰富的行业经验及多项专业资质，可为每位客户提供超预期的业务上云方案。

-
-
-
05
-

勇于创新

-

不满足现状、不固步自封，通过不断的行业实践与技术打磨，持续创新升级全栈云产品与解决方案。

-
-
-
06
-

丰富场景

-

高性能的计算、网络、存储服务，满足不同业务场景的灵活调度，为所有客户提供全栈解决方案。

+
+ +
+

7×24 服务

+

全天候专业技术支持

- +
-
-

发展历程

-
+

发展历程

2022.12
-

注册用户突破10万

-

主题云注册用户累计突破 10W，产品体系日趋成熟。

+

用户突破 10 万

2021.05
-

KVM系列产品上线

-

云服务器迭代升级，正式上线 KVM 系列虚拟化产品。

+

KVM 系列产品上线

@@ -155,23 +94,13 @@

宣布出海计划

-

与全球合作伙伴共建生态，开启国际化征程。

2019.06
-

品牌升级

-

正式更名为主题云，上线云服务器相关业务。

-
-
-
-
2018.11
-
-
-

网站正式上线

-

公司网站正式上线，当月注册用户超过 5000 人。

+

品牌升级，云服务上线

@@ -179,19 +108,16 @@

公司成立

-

公司正式成立，组建核心技术团队。

- +
-
-

荣誉资质

-
+

荣誉资质

{if ( isset($data.honor) ) }
{foreach $data.honor as $key=>$value} @@ -202,48 +128,17 @@ {/foreach}
{else /} -
-
+
{/if}
- -
-
-
-

精选客户案例

-
- {if ( isset($data.partner) ) } -
- {foreach $data.partner as $key=>$value} -
- -

{$value.name}

-

{$value.description}

-
- {/foreach} -
- {else /} -
-
- {/if} -
-
- - +
-

定制云上解决方案

-

即享数智化转型升级

-
- 更优惠的产品信息 - - 更专业的选购建议 - - 定制专属上云方案 -
+

开启您的云上之旅

+

专业方案 · 极致体验 · 全程护航

立即联系
diff --git a/css/about.css b/css/about.css index e3af931..e0883e3 100644 --- a/css/about.css +++ b/css/about.css @@ -1,5 +1,5 @@ /* ============================================ - About 页面 - 全新设计 + About 页面 - 精简版 ============================================ */ /* ---- 整体 ---- */ @@ -8,16 +8,6 @@ min-height: 100vh; } -/* 覆盖 common/extend 中的旧白色主题 */ -#about .section-content { - padding-left: 20px; - padding-right: 20px; -} - -#about .section-title .section-desc { - color: rgba(148, 163, 184, 0.7); -} - #about .section { background: transparent; } @@ -27,7 +17,7 @@ ============================================ */ .about-hero { position: relative; - height: 320px; + height: 360px; display: flex; align-items: center; justify-content: center; @@ -41,32 +31,30 @@ radial-gradient(ellipse at 25% 40%, rgba(99, 102, 241, 0.18) 0%, transparent 55%), radial-gradient(ellipse at 75% 60%, rgba(56, 189, 248, 0.14) 0%, transparent 55%), linear-gradient(135deg, #0F172A 0%, #1E293B 50%, #0F172A 100%); - z-index: 0; } .about-hero-content { position: relative; z-index: 1; text-align: center; + padding: 0 20px; } .about-hero-badge { display: inline-block; - padding: 4px 16px; + padding: 4px 18px; font-size: 11px; font-weight: 600; - letter-spacing: 2px; + letter-spacing: 2.5px; color: #38BDF8; border: 1px solid rgba(56, 189, 248, 0.3); border-radius: 20px; margin-bottom: 20px; - text-transform: uppercase; } .about-hero h1 { font-size: 52px; font-weight: 700; - color: #fff; margin-bottom: 12px; background: linear-gradient(135deg, #fff 30%, #38BDF8 100%); -webkit-background-clip: text; @@ -75,9 +63,12 @@ } .about-hero-desc { - font-size: 17px; - color: rgba(203, 213, 225, 0.8); - margin-bottom: 36px; + font-size: 16px; + color: rgba(203, 213, 225, 0.75); + margin-bottom: 40px; + max-width: 500px; + margin-left: auto; + margin-right: auto; } /* 数据统计横排 */ @@ -85,18 +76,17 @@ display: flex; justify-content: center; align-items: center; - gap: 0; } .stat-item { display: flex; flex-direction: column; align-items: center; - padding: 0 32px; + padding: 0 36px; } .stat-num { - font-size: 28px; + font-size: 30px; font-weight: 700; color: #38BDF8; line-height: 1.1; @@ -104,13 +94,13 @@ .stat-unit { font-size: 16px; - font-weight: 500; + font-weight: 600; color: #38BDF8; } .stat-label { font-size: 12px; - color: rgba(148, 163, 184, 0.7); + color: rgba(148, 163, 184, 0.6); margin-top: 4px; letter-spacing: 0.5px; } @@ -118,195 +108,85 @@ .stat-divider { width: 1px; height: 32px; - background: rgba(148, 163, 184, 0.15); + background: rgba(148, 163, 184, 0.12); } /* ============================================ - 2. 关于我们 — 左文右卡片 - ============================================ */ -.about-intro { - padding: 90px 0; -} - -.about-intro-grid { - display: flex; - gap: 60px; - align-items: stretch; -} - -.about-intro-text { - flex: 1.1; - min-width: 0; -} - -.about-intro-text h2 { - font-size: 32px; - font-weight: 700; - color: #F1F5F9; - margin-bottom: 12px; - background: linear-gradient(135deg, #F1F5F9 30%, #38BDF8 100%); - -webkit-background-clip: text; - -webkit-text-fill-color: transparent; - background-clip: text; -} - -.intro-accent { - width: 48px; - height: 3px; - background: linear-gradient(90deg, #38BDF8, #6366F1); - border-radius: 2px; - margin-bottom: 28px; -} - -.about-intro-text p { - font-size: 15px; - line-height: 1.85; - color: rgba(203, 213, 225, 0.82); - margin-bottom: 16px; - text-indent: 2em; -} - -/* 右侧 2x2 小卡片 */ -.about-intro-visual { - display: grid; - grid-template-columns: 1fr 1fr; - gap: 16px; - flex-shrink: 0; - width: 380px; -} - -.intro-card { - padding: 24px 20px; - background: rgba(30, 41, 59, 0.55); - border: 1px solid rgba(148, 163, 184, 0.1); - border-radius: 12px; - text-align: center; - transition: all 0.3s ease; -} - -.intro-card:hover { - border-color: rgba(56, 189, 248, 0.25); - transform: translateY(-4px); - box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2); -} - -.intro-card-icon { - width: 36px; - height: 36px; - margin: 0 auto 12px; - color: #38BDF8; -} - -.intro-card-icon svg { - width: 100%; - height: 100%; -} - -.intro-card h4 { - font-size: 15px; - font-weight: 600; - color: #E2E8F0; - margin-bottom: 6px; -} - -.intro-card p { - font-size: 12px; - color: rgba(148, 163, 184, 0.7); - line-height: 1.4; -} - -/* ============================================ - 3. 核心优势 — 序号 + 标题 + 描述 + 2. 核心优势 — 简洁 3 列 ============================================ */ .about-advantages { - padding: 90px 0; + padding: 80px 0 60px; } -.about-advantages .section-title { - text-align: center; - margin-bottom: 56px; -} - -.about-advantages .section-title h2 { - font-size: 32px; - font-weight: 700; - color: #F1F5F9; - margin-bottom: 12px; - background: linear-gradient(135deg, #F1F5F9 30%, #38BDF8 100%); - -webkit-background-clip: text; - -webkit-text-fill-color: transparent; - background-clip: text; -} - -.section-subtitle { - font-size: 15px; - color: rgba(148, 163, 184, 0.7); - margin-top: 8px; -} - -.advantages-grid { +.advantages-grid.compact { display: grid; grid-template-columns: repeat(3, 1fr); - gap: 20px; + gap: 24px; + max-width: 900px; + margin: 0 auto; } .advantage-item { - padding: 36px 28px; - background: rgba(30, 41, 59, 0.5); - border: 1px solid rgba(148, 163, 184, 0.08); - border-radius: 14px; - transition: all 0.3s ease; - position: relative; + text-align: center; + padding: 40px 28px; + background: rgba(30, 41, 59, 0.4); + border: 1px solid rgba(148, 163, 184, 0.06); + border-radius: 16px; + transition: all 0.35s ease; } .advantage-item:hover { - border-color: rgba(56, 189, 248, 0.2); - transform: translateY(-4px); - box-shadow: 0 12px 32px rgba(0, 0, 0, 0.2); + border-color: rgba(56, 189, 248, 0.15); + transform: translateY(-6px); + box-shadow: 0 16px 40px rgba(0, 0, 0, 0.2); } -.advantage-num { - font-size: 36px; - font-weight: 800; - color: rgba(56, 189, 248, 0.12); - line-height: 1; - margin-bottom: 16px; - font-family: 'Inter', sans-serif; +.advantage-icon { + width: 44px; + height: 44px; + margin: 0 auto 20px; + color: #38BDF8; + opacity: 0.8; + transition: opacity 0.3s ease; } -.advantage-item:hover .advantage-num { - color: rgba(56, 189, 248, 0.25); +.advantage-item:hover .advantage-icon { + opacity: 1; +} + +.advantage-icon svg { + width: 100%; + height: 100%; } .advantage-item h4 { font-size: 18px; font-weight: 600; color: #E2E8F0; - margin-bottom: 12px; + margin-bottom: 8px; } .advantage-item p { - font-size: 14px; - line-height: 1.75; - color: rgba(203, 213, 225, 0.7); + font-size: 13px; + color: rgba(148, 163, 184, 0.7); + line-height: 1.5; } /* ============================================ - 4. 时间轴 — 纯 CSS 竖版 + 3. 时间轴 ============================================ */ .about-timeline { - padding: 90px 0; + padding: 70px 0; } .about-timeline .section-title { text-align: center; - margin-bottom: 56px; + margin-bottom: 48px; } .about-timeline .section-title h2 { - font-size: 32px; + font-size: 28px; font-weight: 700; - color: #F1F5F9; background: linear-gradient(135deg, #F1F5F9 30%, #38BDF8 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; @@ -315,12 +195,11 @@ .timeline { position: relative; - max-width: 720px; + max-width: 600px; margin: 0 auto; padding-left: 40px; } -/* 竖线 */ .timeline::before { content: ''; position: absolute; @@ -328,21 +207,23 @@ top: 4px; bottom: 4px; width: 2px; - background: linear-gradient(180deg, #38BDF8, rgba(99, 102, 241, 0.4), transparent); + background: linear-gradient(180deg, #38BDF8, rgba(99, 102, 241, 0.3), transparent); border-radius: 2px; } .timeline-item { position: relative; - padding-bottom: 40px; - padding-left: 32px; + padding-bottom: 32px; + padding-left: 28px; + display: flex; + align-items: baseline; + gap: 16px; } .timeline-item:last-child { padding-bottom: 0; } -/* 圆点 */ .timeline-dot { position: absolute; left: -40px; @@ -352,13 +233,14 @@ border-radius: 50%; background: #0F172A; border: 2px solid #38BDF8; - box-shadow: 0 0 12px rgba(56, 189, 248, 0.3); + box-shadow: 0 0 10px rgba(56, 189, 248, 0.25); z-index: 1; + transition: all 0.3s ease; } .timeline-item:hover .timeline-dot { background: #38BDF8; - box-shadow: 0 0 20px rgba(56, 189, 248, 0.5); + box-shadow: 0 0 16px rgba(56, 189, 248, 0.5); } .timeline-date { @@ -366,38 +248,31 @@ font-weight: 600; color: #38BDF8; letter-spacing: 0.5px; - margin-bottom: 8px; + flex-shrink: 0; + width: 68px; } .timeline-content h4 { - font-size: 17px; - font-weight: 600; - color: #E2E8F0; - margin-bottom: 6px; -} - -.timeline-content p { - font-size: 14px; - line-height: 1.6; - color: rgba(148, 163, 184, 0.75); + font-size: 15px; + font-weight: 500; + color: rgba(226, 232, 240, 0.85); } /* ============================================ - 5. 荣誉资质 + 4. 荣誉资质 ============================================ */ .about-honors { - padding: 90px 0; + padding: 70px 0; } .about-honors .section-title { text-align: center; - margin-bottom: 48px; + margin-bottom: 40px; } .about-honors .section-title h2 { - font-size: 32px; + font-size: 28px; font-weight: 700; - color: #F1F5F9; background: linear-gradient(135deg, #F1F5F9 30%, #38BDF8 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; @@ -407,131 +282,62 @@ .honors-grid { display: flex; flex-wrap: wrap; - gap: 20px; + gap: 16px; justify-content: center; } .honor-item { - flex: 0 1 calc(25% - 15px); - min-width: 200px; - max-width: 280px; - padding: 28px 20px; + flex: 0 1 calc(25% - 12px); + min-width: 160px; + max-width: 240px; + padding: 24px 16px; text-align: center; - background: rgba(30, 41, 59, 0.5); - border: 1px solid rgba(148, 163, 184, 0.08); + background: rgba(30, 41, 59, 0.35); + border: 1px solid rgba(148, 163, 184, 0.06); border-radius: 12px; transition: all 0.3s ease; } .honor-item:hover { - border-color: rgba(56, 189, 248, 0.2); - transform: translateY(-4px); - box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2); + border-color: rgba(56, 189, 248, 0.15); + transform: translateY(-3px); + box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15); } .honor-item img { width: 100%; - max-width: 180px; + max-width: 160px; height: auto; border-radius: 6px; - margin-bottom: 12px; -} - -.honor-item p { - font-size: 13px; - color: rgba(203, 213, 225, 0.8); -} - -/* ============================================ - 6. 精选客户案例 - ============================================ */ -.about-cases { - padding: 90px 0; -} - -.about-cases .section-title { - text-align: center; - margin-bottom: 48px; -} - -.about-cases .section-title h2 { - font-size: 32px; - font-weight: 700; - color: #F1F5F9; - background: linear-gradient(135deg, #F1F5F9 30%, #38BDF8 100%); - -webkit-background-clip: text; - -webkit-text-fill-color: transparent; - background-clip: text; -} - -.cases-grid { - display: flex; - flex-wrap: wrap; - gap: 20px; - justify-content: center; -} - -.case-item { - flex: 0 1 calc(33.333% - 14px); - min-width: 280px; - max-width: 400px; - padding: 32px; - text-align: center; - background: rgba(30, 41, 59, 0.5); - border: 1px solid rgba(148, 163, 184, 0.08); - border-radius: 14px; - transition: all 0.3s ease; -} - -.case-item:hover { - border-color: rgba(56, 189, 248, 0.2); - transform: translateY(-4px); - box-shadow: 0 12px 32px rgba(0, 0, 0, 0.2); -} - -.case-item img { - width: 100%; - max-width: 220px; - height: auto; - border-radius: 8px; - margin-bottom: 16px; -} - -.case-item h4 { - font-size: 17px; - font-weight: 600; - color: #38BDF8; margin-bottom: 10px; } -.case-item p { - font-size: 14px; - color: rgba(203, 213, 225, 0.75); - line-height: 1.6; +.honor-item p { + font-size: 12px; + color: rgba(203, 213, 225, 0.7); } /* ============================================ - 7. CTA 联系我们 + 5. CTA ============================================ */ .about-cta { - padding: 80px 0 100px; + padding: 60px 0 90px; } .cta-inner { text-align: center; - padding: 60px 40px; + padding: 56px 40px; background: - radial-gradient(ellipse at 30% 50%, rgba(56, 189, 248, 0.08) 0%, transparent 60%), - radial-gradient(ellipse at 70% 50%, rgba(99, 102, 241, 0.06) 0%, transparent 60%), - rgba(30, 41, 59, 0.4); - border: 1px solid rgba(148, 163, 184, 0.08); + radial-gradient(ellipse at 30% 50%, rgba(56, 189, 248, 0.07) 0%, transparent 60%), + radial-gradient(ellipse at 70% 50%, rgba(99, 102, 241, 0.05) 0%, transparent 60%), + rgba(30, 41, 59, 0.3); + border: 1px solid rgba(148, 163, 184, 0.06); border-radius: 20px; } .cta-inner h2 { - font-size: 30px; + font-size: 28px; font-weight: 700; - color: #F1F5F9; margin-bottom: 8px; background: linear-gradient(135deg, #F1F5F9 30%, #38BDF8 100%); -webkit-background-clip: text; @@ -540,32 +346,11 @@ } .cta-inner > p { - font-size: 16px; - color: rgba(148, 163, 184, 0.7); + font-size: 15px; + color: rgba(148, 163, 184, 0.6); margin-bottom: 28px; } -.cta-features { - display: flex; - justify-content: center; - align-items: center; - gap: 16px; - margin-bottom: 32px; - flex-wrap: wrap; -} - -.cta-features span { - font-size: 14px; - color: rgba(203, 213, 225, 0.7); -} - -.cta-dot { - width: 4px; - height: 4px; - border-radius: 50%; - background: rgba(148, 163, 184, 0.3); -} - .cta-btn { display: inline-block; padding: 12px 40px; @@ -576,21 +361,20 @@ border-radius: 10px; text-decoration: none; transition: all 0.3s ease; - box-shadow: 0 8px 24px rgba(56, 189, 248, 0.25); + box-shadow: 0 8px 24px rgba(56, 189, 248, 0.2); } .cta-btn:hover { transform: translateY(-2px); - box-shadow: 0 12px 32px rgba(56, 189, 248, 0.4); + box-shadow: 0 12px 32px rgba(56, 189, 248, 0.35); } /* ============================================ - 移动端适配 + 移动端 ============================================ */ @media (max-width: 768px) { - .about-hero { - height: 260px; + height: 300px; } .about-hero h1 { @@ -599,12 +383,11 @@ .about-hero-desc { font-size: 14px; - margin-bottom: 24px; } .about-hero-stats { flex-wrap: wrap; - gap: 12px; + gap: 8px; } .stat-item { @@ -619,125 +402,39 @@ display: none; } - /* 关于 */ - .about-intro { - padding: 60px 0; - } - - .about-intro-grid { - flex-direction: column; - gap: 32px; - } - - .about-intro-visual { - width: 100%; - } - - .about-intro-text h2 { - font-size: 24px; - } - - /* 优势 */ - .about-advantages { - padding: 60px 0; - } - - .advantages-grid { + .advantages-grid.compact { grid-template-columns: 1fr; - gap: 16px; + max-width: 400px; } - .about-advantages .section-title h2 { - font-size: 24px; + .about-advantages { + padding: 60px 0 40px; } - /* 时间轴 */ - .about-timeline { - padding: 60px 0; - } - - .about-timeline .section-title h2 { - font-size: 24px; - } - - .timeline { - padding-left: 32px; - } - - .timeline-item { - padding-left: 24px; - } - - /* 荣誉 */ + .about-timeline, .about-honors { - padding: 60px 0; + padding: 50px 0; + } + + .about-timeline .section-title h2, + .about-honors .section-title h2 { + font-size: 22px; } .honor-item { - flex: 0 1 calc(50% - 10px); - min-width: 140px; + flex: 0 1 calc(50% - 8px); + min-width: 120px; } - .about-honors .section-title h2 { - font-size: 24px; - } - - /* 客户案例 */ - .about-cases { - padding: 60px 0; - } - - .case-item { - flex: 0 1 100%; - min-width: auto; - } - - .about-cases .section-title h2 { - font-size: 24px; - } - - /* CTA */ .about-cta { - padding: 40px 0 60px; + padding: 30px 0 60px; } .cta-inner { - padding: 40px 20px; + padding: 36px 20px; } .cta-inner h2 { font-size: 22px; } - - .cta-features { - flex-direction: column; - gap: 8px; - } - - .cta-dot { - display: none; - } -} - -@media (max-width: 480px) { - .about-hero { - height: 220px; - } - - .about-hero h1 { - font-size: 26px; - } - - .about-intro-visual { - grid-template-columns: 1fr 1fr; - gap: 10px; - } - - .intro-card { - padding: 16px 12px; - } - - .advantage-item { - padding: 24px 20px; - } } \ No newline at end of file diff --git a/css/nav-mega-menu.css b/css/nav-mega-menu.css index d8509f0..fd8e265 100644 --- a/css/nav-mega-menu.css +++ b/css/nav-mega-menu.css @@ -13,7 +13,7 @@ overflow: hidden; transition: height 0.25s ease-out; height: 0; - /* 不设背景，由 inner 负责 */ + pointer-events: none; /* 左右空白区域不拦截鼠标 */ } /* ── 下拉内层 —— 居中收窄面板 ── */ @@ -38,6 +38,7 @@ box-shadow: 0 20px 48px rgba(0, 0, 0, 0.55), 0 0 0 1px rgba(255, 255, 255, 0.04) inset; padding: 20px 0 12px; + pointer-events: auto; /* 只有实际内容区域可交互 */ } .nav-cont-menu.nav-cont-empty {