用 css 自定义左右分栏滚动条需针对右栏或左栏容器设置 overflow-y: auto 和 height 约束，再用 ::-webkit-scrollbar 修饰，但仅 chromium 有效；firefox 和旧 safari 不支持，移动端 safari 需 js 模拟，框架中须确保原生滚动容器暴露且未被 overflow: hidden 裁剪。
如何用 CSS 自定义左右分栏的滚动条样式
直接改 ::-webkit-scrollbar 就能生效，但只在 Chromium 系统（Chrome、Edge、新版 Safari）里起作用；Firefox 和旧版 Safari 不支持，得接受默认样式或换思路。
- 必须配合
overflow: auto或overflow: scroll才会触发滚动条渲染，overflow: visible下::-webkit-scrollbar完全无效 - 左右分栏中，通常只对右栏（内容区）或左栏（导航/分类）单独加自定义滚动条，避免父容器和子容器滚动条嵌套冲突
- 常见写法是给右栏容器设
height: 100vh或固定高，并加overflow-y: auto，再在其上叠加伪元素样式 - 不要在
body或根容器上全局覆盖滚动条——会影响所有子区域，比如弹窗、下拉框里的滚动也会被强行改掉
左右分栏里滚动条错位、消失或不显示的典型原因
不是代码没写对，而是布局逻辑和 overflow 层级没理清。最常踩的坑是：父容器 flex 布局没设高度约束，导致子容器无法计算可滚动区域。
- 父容器没设
height或max-height，子元素overflow-y: auto就等于没写——浏览器认为“有足够空间”，根本不会生成滚动条 - 左右栏用了
flex: 1却没限制父容器高度，尤其在flex-direction: column响应式切换后，右栏可能撑满整页，滚动失效 - 左栏用了
position: sticky或fixed，脱离文档流后，其内部滚动条行为异常，建议改用height: 100%+overflow-y: auto - 某些 UI 框架（如 Ant Design）的
<card></card>默认带overflow: hidden，会把自定义滚动条裁掉，需显式覆盖为overflow: visible或overflow-y: auto
左右分栏滚动同步（如文本对比工具）怎么加自定义滚动条
滚动同步本身靠 JS 监听 scroll 事件 + scrollTop 同步赋值，但自定义滚动条不能干扰这个逻辑——否则拖动一个，另一个跳动不跟手。
- 两个滚动容器必须各自独立设置
::-webkit-scrollbar，不能共用同一套伪元素规则，否则宽度/颜色会互相影响 - 同步逻辑里别操作
scrollLeft，左右分栏是垂直滚动场景，只同步scrollTop就够了 - 如果用了虚拟滚动（如
react-window），滚动条其实是模拟的，::-webkit-scrollbar不生效，得用组件提供的scrollbarSize或自定义Scrollbar渲染器 - 移动端 Safari 对
::-webkit-scrollbar支持极弱，且禁止拖拽伪元素，真要兼容 iOS，得用 JS 实现滚动条 UI（比如绝对定位一个<div class="custom-scrollbar">） <h3>Ant Design 或微信小程序里怎么安全加滚动条样式</h3> <p>框架封装层会劫持原生滚动行为，硬套 <code>::-webkit-scrollbar很容易被覆盖或忽略，得先确认目标元素是否真正暴露了原生滚动容器。- Ant Design 的
<card></card>内容区默认没设overflow，需在外层包一层<div style="{{" height: overflowy:>，再对这个 <code>div加伪元素 - 微信小程序用的是 WebView 渲染，
::-webkit-scrollbar在基础库 2.25.0+ 才稳定支持，低于此版本需回退到scroll-view组件，并用scrollbar-color（仅部分安卓）或 JS 模拟 - 小程序里
scroll-view的show-scrollbar属性默认为false，必须显式设为true，且只对scroll-y有效，scroll-x需额外处理 - 别在
App.vue全局样式里写::-webkit-scrollbar，小程序不支持全局伪类注入，必须写在页面级<style scoped></style>里，且选择器要精确到具体容器类名
实际开发中，最易被忽略的是：滚动条样式生效的前提，不是“写了伪元素”，而是“容器确实产生了可滚动区域”。很多问题表面是样式不生效，本质是 height / flex 分配 / overflow 组合没配对。
- Ant Design 的
