/* ============================================================ 内容区最大宽度统一：1600px -> 1400px 2026-09-23 由 html/head.html 引用（位于 body 内，晚于各页的 CSS 加载，同权重下后者生效 -> 无需逐个修改 13 个页面 CSS 与版本号）只覆盖原本 max-width:1600px 的容器。首页 .banner-content 原为 max-width:1200px（有意设计），故用 .page-banner 限定，不误伤。 ============================================================ */ .container, .header-wrap, .footer-wrap, .copyright, .about-data, .culture-header { max-width: 1400px; } /* 内页 banner：文字块 + 二级导航 */ .page-banner .banner-content, .banner-subnav-inner, .banner-subnav-list { max-width: 1400px; } /* ------------------------------------------------------------ 例外：首页「产品与业务」轮播不参与收窄。 2026-09-23 客户要求「后面的图变成全屏」，底图必须铺满整屏，所以 .business-carousel 不再列在上面的名单里（它的宽度在 index.css 里显式设为 100%）。卡片与左右箭头改由 .business-layer 归位到 1400 容器，保证全屏底图上的元素仍然和整站对齐。 ------------------------------------------------------------ */ /* ============================================================ 全站 banner 副导航统一层 2026-09-24 ------------------------------------------------------------ 背景：副导航曾是三套互不兼容的实现，客户一眼看出不一致： ① solution.css（/pages_12/ 整体解决方案）—— 居中紧凑 + 5px 金条 >>> 客户认可这套，本文以它为基准 <<< ② training.css（/pages_14/ 粮库咨询与培训）—— li 用 flex:1 把三项等分整宽（客户："副导航分的太开"）+ a.active::after 的 3px 细条（"金条变得很细"） ③ product-list.css / newslist.css（/images_1x/ 产品子类、/news_4/ 新闻中心） —— 同样是 a.active::after 的 3px 细条本文件由 head.html 引入、位于 body 内，晚于各页里的 CSS 加载，同权重下后者生效 —— 所以在这里一次性把三套拉平，不必逐个改页面 CSS 与版本号。金条统一由 .banner-subnav-indicator 承担（定位逻辑见 js/subnav.js）。 ============================================================ */ .banner-subnav { position: absolute; bottom: 0; left: 0; right: 0; background: rgba(0, 0, 0, .45); backdrop-filter: blur(4px); } .banner-subnav-inner { margin: 0 auto; padding: 0 20px; display: flex; justify-content: center; position: relative; } .banner-subnav-list { display: flex; list-style: none; position: relative; margin: 0; padding: 0; } /* 覆盖 training.css 的 li{flex:1}（那是"三项分太开"的元凶），按文字宽紧凑居中 */ .banner-subnav-list li { flex: 0 0 auto; text-align: center; } .banner-subnav-list li a { display: block; padding: 18px 22px; color: #fff; font-size: 16px; text-decoration: none; white-space: nowrap; transition: color .3s; } .banner-subnav-list li a:hover { color: var(--gold-light, #c9b189); } .banner-subnav-list li a.active { color: var(--gold-light, #c9b189); } /* 压制各页自带的 a.active::after 细条 —— 注意必须带上 .active 那一档，否则权重低于原规则（0,3,2 vs 0,2,2）会失效。 */ .banner-subnav-list li a::after, .banner-subnav-list li a:hover::after, .banner-subnav-list li a.active::after { content: none; } .banner-subnav-indicator { position: absolute; bottom: 0; left: 0; width: 0; height: 5px; background: var(--gold, #a88b5e); border-radius: 2px; transition: left .35s cubic-bezier(.4, 0, .2, 1), width .35s cubic-bezier(.4, 0, .2, 1); } @media (max-width: 768px) { .banner-subnav-inner { justify-content: flex-start; overflow-x: auto; } .banner-subnav-list { flex-shrink: 0; } .banner-subnav-list li a { padding: 14px 18px; font-size: 14px; } }