From cdc67e0ea3727103cbef8c9934f5ff1b5df5cfd4 Mon Sep 17 00:00:00 2001 From: g1307092382 <1307092382@qq.com> Date: Tue, 20 Oct 2026 00:15:37 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E5=A4=8D=E4=BA=A7=E5=93=81=E6=88=AA?= =?UTF-8?q?=E5=9B=BE=E6=9C=AA=E5=85=A8=E5=B0=BA=E5=AF=B8=E5=B1=95=E7=A4=BA?= =?UTF-8?q?=EF=BC=9A=E8=A7=86=E8=A7=89=E5=88=97=20420px=20=E5=9B=BA?= =?UTF-8?q?=E5=AE=9A=E5=AE=BD=E6=94=B9=E6=AF=94=E4=BE=8B=E5=88=86=E9=85=8D?= =?UTF-8?q?=20+=20=E5=8E=BB=E9=99=A4=E5=BC=BA=E5=88=B6=E8=A3=81=E5=89=AA?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 部署实测问题:产品卡视觉列硬编码 420px,截图渲染仅约 420px 宽;且 aspect-ratio:16/9 + object-fit:cover 将非 16:9 截图(如 4:3 的 AI智习室管理后台)上下裁掉 - 修复:.product 网格列改 minmax(0,1.15fr) minmax(0,.85fr)(桌面端截图渲染宽 420→599px);.product-shot-img 去除 aspect-ratio/object-fit,按各图原始比例完整展示(HTML width/height 属性本就与 WebP 自然尺寸一致,无 CLS 风险) - 取证(cdp-verify-shots.mjs):新增 IMG_NOT_FULLSIZE(rendered≥520px)与 IMG_CROPPED(渲染比例=原始比例±1%)断言,四图 rendered=599 且 cropFree 全 true;移动端单栏 390px 无溢出;零 console 错误、零失败请求 --- assets/css/style.css | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/assets/css/style.css b/assets/css/style.css index 4ebbfea..d6c3601 100644 --- a/assets/css/style.css +++ b/assets/css/style.css @@ -127,14 +127,14 @@ body[data-lang="zh"] .en,body[data-lang="en"] .zh{display:none} .about-chips li{background:#fff;border:1px solid var(--line);border-left:4px solid var(--blue-500);border-radius:12px;padding:16px 20px;font-weight:600;font-size:15px;color:var(--navy-800);box-shadow:var(--shadow)} /* PRODUCTS */ -.product{display:grid;grid-template-columns:420px 1fr;gap:48px;align-items:center;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.09);border-radius:24px;padding:44px;margin-bottom:36px} +.product{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:48px;align-items:center;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.09);border-radius:24px;padding:44px;margin-bottom:36px} .product:nth-child(even){direction:rtl} .product:nth-child(even)>*{direction:ltr} .product-visual{display:flex;flex-direction:column;gap:20px;align-items:center} .product-icon{width:96px;height:96px;border-radius:24px;display:grid;place-items:center;background:linear-gradient(140deg,rgba(30,95,216,.28),rgba(232,86,42,.18));border:1px solid rgba(91,155,255,.35);color:var(--blue-400)} .product-icon svg{width:52px;height:52px} .product-shot{width:100%;aspect-ratio:16/10;border:1.5px dashed rgba(255,255,255,.22);border-radius:14px;display:grid;place-items:center;color:rgba(255,255,255,.4);font-size:13.5px;letter-spacing:1px;background:rgba(255,255,255,.03)} -.product-shot-img{width:100%;aspect-ratio:16/9;object-fit:cover;object-position:center;border:1.5px solid rgba(255,255,255,.14);border-radius:14px;background:rgba(255,255,255,.03);box-shadow:0 18px 50px rgba(0,0,0,.35)} +.product-shot-img{width:100%;height:auto;border:1.5px solid rgba(255,255,255,.14);border-radius:14px;background:rgba(255,255,255,.03);box-shadow:0 18px 50px rgba(0,0,0,.35)} .product-shot-cap{font-size:12.5px;color:rgba(255,255,255,.68);letter-spacing:.5px;text-align:center} /* ===== 产品详情:痛点 / 方案 / 场景 / 效益 ===== */ .pb-block{margin-top:18px}