为啥这帮煞笔前端设计师，把 PC WEB 滚动条 搞 那么细？
0@archxm
- 纯吐槽，不知道大家有没有同感？
- 鼠标很难准确点到，需要仔细，浪费大脑算力，浪费眼力。
- 这帮设计师是怎么想的，自己网站，自己不用？
1@745839
用鼠标滚轮，用触摸板双指滑动
2@chunqiuyiyu
为了好看呗，我还见过把滚动条隐藏了的，真的反人类……
3@EchoWhale
滚动条搞那么粗丑得要死，用鼠标滚轮不香吗
4@Wanex
因为很丑，特别是 windows 的滚动条，没见过这么丑的
5@courtier
原生的丑，而且不同系统的不统一，还有更想吐槽为什么有鼠标不直接用滚轮，对我来说滚动条的作用就只是让我直到能滚还有能滚多远而已
6@archxm
@745839 太长了，滚轮要滚很久，效率低。
7@ZhaokunZhang
有的不一定是前端加的，有的兴许是设计让去掉的。草台班子就这样。
不考虑美感，不考虑实际场景，向上交付就可以了。
8@woodfizky
PC WEB 什么页面有自己实现的滚动条？你吐槽也带个截图嘛。。
基本上我看的网页都是浏览器自带滚动条了。
而且平时用也是用滚轮/触摸板手势居多了，很少需要点滚动条调整了。
9@archxm
@chunqiuyiyu 短途用滚轮，长途就得点住了拖动。
10@zx9481
11@PopRain
1.windows edge 最大化状态，鼠标移到滚动条就到头了，定位没有问题； 拖动滚动条，只要按着拖，鼠标离开滚动条范围也是可以拖的
2.你是不是需要换个鼠标？
12@archxm
@woodfizky 你滚轮和触摸板，如果大距离定位？
我鼠标罗技 G102 ，有些长页面，滚动条得滚动很久。
我知道有那种滚动特别快的，但那又不够准。
总之，用鼠标点住了，拖动，效率更高。
13@uid2023
设计缺陷，应该加个 hover 放大 就好了
14@archxm
@PopRain 我这个罗技 g102 算相当好用，我好几只。
我敢说，我们公司大部分人，用的公司给的鼠标，50 元价位那种。
实际上，高端鼠标，那种滚轮我也感受过，去店里用过，不好用，
定位，还是不如左键点住了拖动好。
15@shinession
网页上的是可以自定义的, 我理解 OP 看的是长页面, 有些页面比如有几百页 pdf 那么长, 你再滚动指划也是不可能有拖动滚动条方便的, 10 楼的方法就不错, 强制显示滚动条
16@woodfizky
@archxm #12 这种情况你的滚动条是不是在最右边呢？
反正我用的 edge 浏览器，窗口最大化，光标拖到最右边，不需要精准定位，没有这个困扰。
除了触摸板手势、滚轮以外，还有个滚动方式是按鼠标中键(滚轮键)后拖动，这个方式也有自己的优缺点，你也可以试试。
我觉得每种交互方式都有特点，都可以用。
而且如果遇到这种需要大距离定位的，我都是能搜索定位就搜索。
17@wudicgi
同意
Firefox 里可以设置 layout.css.scrollbar-width-thin.disabled 为 true 解决这个问题
18@yh7gdiaYW
@archxm 不是非得用鼠标，键盘 pageup 、pagedown 效率不比鼠标拖滚动条低
19@archxm
@shinession 没几百页 pdf 那么长，
就是豆包 ai ，我跟它对话，也不算特别长吧。
我浏览器是带有滚动条修改的，大部分网站，都能改滚动条样式。
豆包 web ，把自带滚动条隐藏了，然后他们前端自己实现了一套，
特点是，鼠标滚轮动，它就会显示，然后几秒后就隐藏消失。
消失后，屏印象把鼠标指针移动过去，点住，拖动，是没问题的。
但它会消失，且鼠标 hover ，它也不显示，这就很难受了，缺乏人性化反馈。
不过，虽然他重新设计了滚动条，我这个浏览器插件到时可以改粗细，但改不了自动消失的问题。
我想着 F12 研究一下，发现它有 js 实现，我这种非职业前端开发者，还是没那个 hack 能力。
20@tars13344
@archxm #6 按住滚轮鼠标下移
21@2kDemon
@uid2023 附议，移入内容区显示滚动条，hover 放大滚动条。美观实用平衡。
22@yougg
如果页面上没有提供一键跳转到底部/顶部, 最快速的方法还是用键盘.
Home 一键到顶部
End 一键到底部
按住 Page Up/Down 快速上滚/下滚, 比鼠标省事多了.
23@archxm
@wudicgi 其实其他浏览器，也可以装扩展来解决。但少部分网站，那个扩展失效了。
24@archxm
@tars13344 我不喜欢按住滚轮，一是手感不好，二是担心把滚轮按坏。
25@archxm
@archxm #24 再一个，按住滚轮，拖动，很慢
26@archxm
@archxm #25 再一个，按住滚轮，拖动，很慢，且不准
27@archxm
@woodfizky #16 但我大部分都是窗口化的，最大化后，太大了，眼睛累。
28@archxm
@yh7gdiaYW 试过了，还是鼠标点住，拖动，效率更高
29@mingli
也可以试试 vim 扩展，摆脱鼠标困扰
30@zjyg1993
煞笔用户鼠标没滚轮吗，自己不会拖吗；页面再长，你拖动桌子深度一样不满足，滚轮基本就是最优解
31@woodfizky
@archxm #27 啥系统，windows 吗？你打 FPS 游戏吗？
个人喜欢把 windows 的"增强指针精度"设置关掉，这个东西纯属傻逼微软式翻译，本质上是鼠标加速度开关，开了反而不利于精准定位。可以开关试试。
当然如果你知道这个东西那当我没说。
32@ntedshen
。。。我自己写滚动条宽度都只留 8px 。。。4k100%缩放，中键用习惯了
https://developer.mozilla.org/en-US/docs/Web/CSS/Guides/Scrollbars_styling
以及，你反正用豆包那你不如问下他：
实现一段 css ，把当前网页上的滚动条强制改成 24px 宽度
然后装个 stylus
33@liu7say
因为滚动条粗了真的很丑感觉...
我以前还特意用过滚动条改细的油猴脚本
虽然可能初期不习惯,但是真可以用鼠标中间代替滚轮,省去将鼠标集中在滚动条的限制
34@deplives
没有同感，滚动条对我我的唯一作用就是看一下下面还有多少内容
35@Tesla9527
我喜欢按空格键翻页滚动
36@archxm
@woodfizky 是的 win10 ，那个指针精度一直关着
37@aliveyang
有问题你可以自己装插件改，总想着别人迁就你？
38@banzhe
滚动条太难看了, 还占空间, 我自己用的页面经常会考虑要不要把滚动条删了
39@yoyoluck
滚动条不是浏览器自带的吗 网页会专门去控制滚动条样式/大小？
40@rm0gang0rf
很多这种
41@EdmondGUO
@archxm #6 这时候鼠标手势的优势就体现出来了，我有两个手势是滚到最上/最下
42@laved
这也能赖前端？
43@cat3399
视觉细，点击区域宽
44@titanium98118
我都是按 d 、u 、G 、g 的
45@yhxx
试试 pageup 和 pagedown
46@Erniu
装一个 Stylus Chrome 插件，然后让 AI 给你改一下滚动条样式，就像这样：
47@SakuraYuki
不如直接滚轮或者触控板，这玩意对大多数人来说就是个网页浏览进度条，当然是越细越美观越好，不可能为了你们这些小众需求来让大众迁就你们的
48@Tyrant1984
要不按一下中键试试？
或者买个罗技 MASTER 感受下无阻滚轮也行~~
49@chibop
1 、老实说，没拖过滚动条。
2 、给 V 友提供思路，我觉得正确解决长内容应该自动解析网站内容，然后左侧生成节点标题，想看哪快速点击。
50@caiqichang
对比一下，不仅喜欢把滚动条改小，还喜欢把颜色改淡，甚至去掉上下箭头
https://i.imgur.com/ZXWWNNC.png
51@SmithJohn
弱化显示，那么目的当然是希望你不用，或者用替代方案。
52@EricYuan1
我是真几乎不用滚动条，mac 上触控板很舒服～
53@Stargaze
罗技 MX Master 没这个烦恼
54@ShiBuYi
跟 前端设计师 也咩关系吧。。
前端都懒得动
55@webberQian
这和前端有关系吗？？？
发泄都找不准对象
56@Endocryne
我用 modern scroll ，平时滚动条隐藏，用鼠标或者键盘滚动页面的时候显示，鼠标移动到滚动条时滚动条会变粗，挺优雅的。这都是浏览器的样式决定的，和前端没关系吧，况且不顺眼可以随便定义，现在 vibe coding 改改界面啥的也不难。
57@emmo
快速滚动，中键按下去拖鼠标，精细滚动用滚轮。
58@kevan
确实恶心。。。
59@vhxubo
因为客户/领导/产品经理/项目经理/UI 觉得滚动条太丑了，还有要求直接隐藏滚动条的。
60@BornThisWay
ui 或者甲方要求的 美观
前端才懒得给你搞这个
巴不得全都是 ai 直出无任何花里胡哨的东西
61@ciki
不都是鼠标滚轮？谁没事用鼠标去拖
62@Pending
可以好看和好用兼得的。
鼠标没移到滚动条附近时保持纤细美观的状态，鼠标移动过去接近时再把滚动条动态变大，鼠标远离时又缩回原样。
63@LearningKid
滚动条越窄越美观，美得很客观
64@ninjaJ
其实有很多 web 无障碍设计被以好看为由去掉了，不只是滚轮。
65@gcckkf
如果是直接到底部可以用键盘 `End` `Home` 直接滚动到底部 顶部
66@Sentimental
windows 的实在太丑陋了，web 自定义滚动条其实都是按 macOS 的样式照抄的
67@fggz
真的有感，鼠标滚轮失灵了，用鼠标拖，老是点不上擦，有的直接没有滚动条 T_T
68@yidinghe
这样的设计最开始是为了触屏，如今前端设计都是触屏优先，没人在乎桌面端了
69@wobuchiyu
草泥马 你要骂就骂那个网站，还带上工种了，你个大撒被
70@nilaoda
@caiqichang 确实是，win11 系统默认的滚动条就不显示上下箭头
71@caiqichang
@nilaoda win11 鼠标悬浮在滚动条上会显示上下箭头，element 这个是完全去掉的
72@ffalex
@caiqichang 变淡就行了，拖动滚动条对我而言还是蛮常见的场景😂
73@archxm
@wobuchiyu 哎哟，被说中啦，不爽了。有活干啦，准备好降工资没？
74@hicdn
电脑版网页起码还有鼠标能用，再差还能按方向键移动。
使用小屏幕手机的用户，总会遇到内容在屏幕显示不全，又不能上下滑动的 APP 页面，满满地恶意。
75@bowencool
@wobuchiyu 现在都没有前端设计师了吧，都是 AI 全干
76@Lemonadeccc
粗了特别丑。
如果不是 UI 的图，才不会为了一个滚动条样式写好多行兼容性样式。
这事你得找 UI 聊
77@Cheons
？
鼠标滚轮
鼠标中间按下，下拉
触摸板
键盘方向下键、home 、end 、pageup 、pagedown 。
ctrl+f
ai 页面 deepseek 有标注横杠选择关键词条
这么多方式没一个喜欢的吗？非要用那垃圾的豆包？
78@fashionash
你可能再问 Page Up/Down 这 2 个按键
79@zoharSoul
啊? 这玩意还有人用鼠标点?
80@zoharSoul
@zoharSoul #79 算了也正常, 不过大部分人只是看 不会点, 所以才会被弱化
81@archxm
@Cheons 豆包那个是个问题，其实问题不大。
其他的话，我日常用浏览器扩展改滚动条风格，
但也有不少网站，滚动条风格没法改，很细。
pageup 、pagedown ，以及其他，不解决问题，
我没触摸板，而且我在说一个普遍问题，很多人的鼠标，还不如我的好使。只不过，他们不发声。
刚需：鼠标移到滚动条上，左键点住，上下拖动。
82@ajan
前端不背这黑锅。
真的很讨厌那细的滚动条，尤其是在 Windows 下 + 没有触摸设备；
之前 企业微信文档 就有这个问题，我跟企业微信团队反馈后，滚动条加宽了几像素；
83@supersleepking
你要滚动条干什么
84@Mikuchan
是我干的，我甚至有些直接把滚动条去掉
85@zghbyslzf
大部分时候用滚轮，需要手动点击滚动条的时候，按住滚动往下拉啊，不会用还天天巴拉巴拉。
86@lightyisu
行吧 用久了习惯了粗的 又说煞笔设计师和前端为什么搞这么粗 比例那么大
87@KingZZZZ
因为你是少数用鼠标点上去的人
88@wobuchiyu
@archxm #73 干你个大傻被。
89@caiyuan
我也是傻逼吗。。。哈哈哈。
我也喜欢搞细的，甚至有时候我都把滚动条隐藏了。我觉得用不到啊。啥情况下会去点击拖动滚动条呢？
90@nilaoda
其实更难受的是远程场景：滚动条默认不可见，虚拟鼠标移上去也不出现，只有触发滚动后细细的滚动条才出现，此时赶紧把虚拟鼠标移上去才能按住快速拖动进度，晚了就又自动隐藏了
91@squarefong17
因为他们不怎么用键鼠，触控板那个滑动有惯性的话滑的也很快
92@vipfts
有 AI 有油猴脚本自己改呗
93@win8en
@Mikuchan 我也是，我也不喜欢粗滚动条。我的网站都是细的，不滚动时几乎看不见，滚动了会清晰点，鼠标放置的时候清晰。我感觉这样设计没有问题。
94@oamu
写过页面的人都不会喜欢滚动条，这东西挤占页面空间，不同设备宽度大小还有差异，而且在一些设备上默认的滚动条十分难看，和 UI 格格不入。图省事的一般就直接把它干掉了。
95@kinghly
外行设计、产品、运营，只关注 UI 看起来美观；完全不懂 UX
96@FalconD
默认就是那么宽
相关标准和实现都是一坨大的
就一定会有人自绘
97@goumadantui
觉得你是那种认为屏幕边框必须要有大黑边的人...但现在的趋势就是无边框，毕竟这样的话内容就能显示更多了
98@Oktfolio
几乎不用滚动条
99@macha
不需要滚动条，鼠标滚轮就行了。
100@iTYC
我做的所有页面全部取消了滚动条，因为完全没有存在的必要
101@levelworm
看来大家想法真的不同，反正我是接受不了没有滚动条这么重要的东西，除非你的页面不需要滚动。
102@levelworm
@win8en #93
大佬你有没有想过，滚动条不单单是滚动，我还可以拖啊？当然你的页面如果比较短，那就无所谓了。但是你设想一下，看个长文档，想拖到一个地方，没有滚动条是很不方便的。
103@cj941030
设计师干的吧。很多软件比 web 还恶心，根本看不懂滚动条，包括如今各种 agent 软件，什么 qoder ，之类的一大堆都是，窗口太长，滚动条在最外侧一点点，鼠标一离开窗口就不见了，滚动条想按住快速拖动，难如登天。
104@trytrytry
骂不动了, 真的很无力, 不需要的人总是能给你反驳
chrome 大更新以后就是默认细滚动条了, 超级恶心, 再加上 macos 的奇葩全屏, 靠右直接变伸缩, 逆天的逆天, 可这些爱"美"的设计师总能掌握话语权
105@kkwa56188
为数不多的 贴主被大部分人喷 但是我完全站贴主一边的 贴.
就是因为很多人不懂得使用滚动条, 所以滚动条才被弄得那么细. 劣币驱逐良币.
106@levelworm
@trytrytry #104
请问有办法写脚本加宽吗？
107@trytrytry
@levelworm MDN 里说能改 https://developer.chrome.com/docs/css-ui/scrollbar-styling?hl=zh-cn, 但是你要全网页应用就比较麻烦吧
108@guo4224
mouse：？？？？
109@Lemon2ee
我自己的网站是直接 disable ，但是会有一些其他的视觉反馈“正在滚动”/“大概在 view 的哪一部分”
110@frankies
我做的网页是直接把滚动条强制禁用了，问就是有强迫症，不同浏览器滚动条让我精心设计的美观页面变得很丑很傻。
111@gp0119
问 UI 吧，前端不会没事去写滚动条样式
112@shakoon
骂得好，不是谁都需要把网页从头看到尾的。滚动条这么重要的东西，能极快定位到想看的位置，效率是滚轮的若干倍。但凡是个真正从用户使用角度去考虑，绝不会做出这么反人类的设计。楼上一些口口声声说为了好看的，如果不好用，光有好看谁会去看
113@icyalala
设计/产品很多都用 Mac ，触摸板模式下默认就是隐藏滚动条的，因为滚动条实在太看难
而且 Mac 触摸板滑动有惯性，像这 100 楼滑动两次就能到底，定位也很准确
对应的话，你得用带有无阻尼/无极滚轮的鼠标，才勉强有类似的体验
114@heliker
这里想吐槽一下各在线表格的底部那根“细如头发丝”的横滚动条，每次想往左或右滑动表格，都很痛苦。