abbr[title] { border-bottom: 1px dotted; cursor: help; position: relative; } abbr[title]::after { content: attr(title); position: absolute; left: 0; bottom: 125%; background-color: #ffffff; /* 白色背景 */ color: #1B85E3; /* 腾讯蓝字体 */ padding: 3px 6px; /* 调整内边距,使弹窗小巧 */ border-radius: 4px; white-space: nowrap; font-size: 12px; /* 字体变小 */ line-height: 1.2; /* 行高紧凑 */ opacity: 0; pointer-events: none; transition: opacity 0.2s; z-index: 100; box-shadow: 0 2px 6px rgba(0,0,0,0.15); } abbr[title]:hover::after { opacity: 1; } /* ========================= 全局主题颜色修改为 #0183fa ========================= */ /* 导航栏菜单文字 */ .md-header-nav__link, .md-header-nav__link:hover, .md-header-nav__link--active { color: #0183fa !important; } /* 所有章节标题 H1-H6 */ .md-content h1, .md-content h2, .md-content h3, .md-content h4, .md-content h5, .md-content h6 { color: #0183fa !important; } /* 底部 footer */ .custom-footer { color: #0183fa !important; } /* 如果 footer 内有链接,也改颜色 */ .custom-footer a { color: #0183fa !important; text-decoration: none; } .custom-footer a:hover { text-decoration: underline; } /* ========================= 右侧目录选中条目颜色 ========================= */ .md-nav--secondary .md-nav__link--active { color: #0183fa !important; /* 文字颜色 */ font-weight: 600; /* 加粗显示,可选 */ } /* 鼠标悬停右侧目录条目颜色 */ .md-nav--secondary .md-nav__link:hover { color: #0183fa !important; } /* ===================================== 顶部 Tabs:选中项文字变蓝(无下划线) ===================================== */ /* 当前激活的 Tab 文本 */ .md-tabs__item--active > .md-tabs__link { color: #0183FA !important; font-weight: 600; } /* Hover 状态也统一为蓝色 */ .md-tabs__link:hover { color: #0183FA; } /* ❌ 移除默认的底部横线 */ .md-tabs__item--active .md-tabs__link::after { display: none !important; } /* 有些版本是 border-bottom 方式,也一并清掉 */ .md-tabs__item--active .md-tabs__link { border-bottom: none !important; } /* ===================================== 左侧导航(Sidebar)选中 & Hover 蓝色化 ===================================== */ /* 1️⃣ 当前页面(选中态,最关键) */ .md-nav__link--active { color: #0183FA !important; font-weight: 600; } /* 2️⃣ 当前展开的父级节点 */ .md-nav__item--active > .md-nav__link { color: #0183FA !important; } /* 3️⃣ 鼠标 Hover(覆盖默认的 accent 紫色) */ .md-nav__link:hover { color: #0183FA !important; } /* 4️⃣ 左侧折叠/展开箭头 */ .md-nav__item--active > .md-nav__link .md-nav__icon, .md-nav__link:hover .md-nav__icon { color: #0183FA; } /* 5️⃣ 防止 Material 用 accent 色反向覆盖 */ .md-nav__link:focus { color: #0183FA !important; } :root { --system-primary: #0183FA; } /* “更多”作为 tab 项在最右侧 */ .md-tabs__item--more{ margin-left: auto; position: relative; display: flex; align-items: stretch; /* 让内部能撑满 tab 行高度 */ } /* 关键:按钮撑满 tab 行高度 + flex 垂直居中 + 去基线影响 */ .md-tabs__more-link{ height: 100% !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; padding: 0 12px !important; line-height: 0 !important; /* ✅ 防止贴底 */ border: 0 !important; background: transparent !important; cursor: pointer !important; pointer-events: auto !important; /* ✅ 确保可点 */ } /* 三角本体 */ .md-tabs__more-triangle{ display: block; width: 0; height: 0; border-left: 8px solid transparent; border-right: 8px solid transparent; border-top: 10px solid var(--system-primary); } /* 下拉面板(JS 用 style.display 控制显示) */ .md-tabs__item--more .md-tabs__more-panel{ position: absolute; right: 0; top: 100%; margin-top: 6px; min-width: 240px; max-width: 420px; max-height: 60vh; overflow: auto; padding: 6px; display: none; z-index: 9999; background: #fff; border: 1px solid rgba(0,0,0,.12); border-radius: 10px; box-shadow: 0 10px 30px rgba(0,0,0,.18); } [data-md-color-scheme="slate"] .md-tabs__item--more .md-tabs__more-panel{ background:#1e1e1e; border-color: rgba(255,255,255,.12); } /* 面板条目 */ .md-tabs__more-item{ display:block; padding: 8px 10px; border-radius: 8px; text-decoration:none; color: inherit; white-space: nowrap; } .md-tabs__more-item:hover{ color: var(--system-primary); background: rgba(1,131,250,0.08); } .md-tabs__more-item.is-active{ color: var(--system-primary); font-weight: 600; background: rgba(1,131,250,0.10); } :root { --system-primary: #0183FA; } /* 让整个 Tabs 行按 flex 布局,垂直居中所有 tab */ .md-tabs__list{ display: flex !important; align-items: center !important; /* ✅ 关键:整体垂直居中 */ } /* 每个 tab 项也用 flex,避免基线对齐把内容压到底 */ .md-tabs__item{ display: flex !important; align-items: center !important; } /* “更多”tab 放最右侧 */ .md-tabs__item--more{ margin-left: auto !important; } /* 更多按钮:去掉基线影响,保证居中 */ .md-tabs__more-link{ display: inline-flex !important; align-items: center !important; justify-content: center !important; padding: 0 12px !important; line-height: 1 !important; /* ✅ 不要用 0,0 在某些字体下会贴底 */ border: 0 !important; background: transparent !important; cursor: pointer !important; } /* 实心蓝色倒三角 */ .md-tabs__more-triangle{ display: block; width: 0; height: 0; border-left: 8px solid transparent; border-right: 8px solid transparent; border-top: 10px solid var(--system-primary); } /* 防止第 10 个 tab 露出一截:Tabs 行裁剪 */ .md-tabs__list{ overflow: hidden !important; }