/** * 全站顶栏：统一主题蓝、左侧品牌、右侧导航 * 各页面 中引入：/css/sv_site_nav.css */ :root { /* 主题色取自“反馈你的需求”按钮：#0068df */ --sv-nav-bg: #0068df; --sv-nav-border: #005bc2; --sv-nav-muted: rgba(255, 255, 255, 0.78); --sv-nav-hover: #ffffff; --sv-nav-active: #ffffff; --sv-nav-height: 50px; /* 以个股分析页当前顶栏高低为基准，统一全站页面切换时的顶栏高度 */ --sv-nav-pad-top: 24px; --sv-nav-pad-bottom: 16px; --sv-nav-max-w: 1280px; } .sv-site-header { position: sticky; top: 0; z-index: 100; width: 100%; background: var(--sv-nav-bg); border-bottom: 1px solid var(--sv-nav-border); } header.sv-site-header { padding-top: var(--sv-nav-pad-top); padding-bottom: var(--sv-nav-pad-bottom); } .sv-site-header__inner { max-width: var(--sv-nav-max-w); margin: 0 auto; padding: 0 20px; height: var(--sv-nav-height); display: flex; align-items: center; justify-content: space-between; gap: 16px; } .sv-site-brand { display: inline-flex; align-items: center; color: var(--sv-nav-active); text-decoration: none; font-weight: 600; font-size: 18px; letter-spacing: -0.02em; flex-shrink: 0; } .sv-site-brand:hover { color: var(--sv-nav-hover); opacity: 0.95; } .sv-site-nav { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 4px 8px; margin: 0; padding: 0; } .sv-site-nav__link { display: inline-block; padding: 6px 10px; border-radius: 6px; font-size: 15px; font-weight: 500; color: var(--sv-nav-muted); text-decoration: none; white-space: nowrap; transition: color 0.12s, background 0.12s; } .sv-site-nav__link:hover { color: var(--sv-nav-hover); background: rgba(255, 255, 255, 0.12); } .sv-site-nav__link.is-active { color: var(--sv-nav-active); font-weight: 600; background: rgba(0, 0, 0, 0.12); } @media (max-width: 720px) { .sv-site-header__inner { height: auto; min-height: var(--sv-nav-height); padding-top: 10px; padding-bottom: 10px; flex-wrap: wrap; align-items: flex-start; } .sv-site-nav { justify-content: flex-start; } }