V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
Joseph0717
V2EX  ›  Vue.js

最新版 chrome 滚动条样式

  •  
  •   Joseph0717 · 328 天前 · 2878 次点击
    这是一个创建于 328 天前的主题,其中的信息可能已经有所发展或是发生改变。
    最新版 chrome 滚动条样式是不是发生变化了,自己定义的样式都失效了
    9 条回复    2024-01-30 10:26:24 +08:00
    Joseph0717
        1
    Joseph0717  
    OP
       328 天前
    版本 121.0.6167.86
    locatez
        2
    locatez  
       328 天前   ❤️ 2
    0x723b
        3
    0x723b  
       328 天前   ❤️ 1
    并没有,这个正常使用 https://greasyfork.org/zh-CN/scripts/472690
    kebamt
        4
    kebamt  
       328 天前
    ```
    /* Hide browser scrollbar */
    ::-webkit-scrollbar {
    display:none;
    }
    ```
    试试这个?
    Chuckle
        5
    Chuckle  
       328 天前
    以前的也能正常用,但是 scrollbar 优先级更高,设置了 scrollbar 就会导致原来的::-webkit-scrollbar 失效,scrollbar 太丑陋了,还是只在火狐上用吧(
    @-moz-document url-prefix() {
    这里面写的样式就只有火狐这类浏览器生效
    }
    No3ks
        6
    No3ks  
       328 天前
    楼主 是不是变成很细的一条了
    fgt1t5y
        7
    fgt1t5y  
       327 天前
    @No3ks #6 是的,滚动条模式变的很细一根,不是系统原生的滚动条了
    Joseph0717
        8
    Joseph0717  
    OP
       327 天前
    @No3ks @kebamt 这样可以全局生效
    ::-webkit-scrollbar {
    width: 8px;
    height: 8px;
    }
    /* Track */
    ::-webkit-scrollbar-track {
    border-radius: 8px;
    background: @layout-body-background;
    }
    /* Handle */
    ::-webkit-scrollbar-thumb {
    border-radius: 8px;
    background: @primary-color;
    }
    No3ks
        9
    No3ks  
       327 天前
    @fgt1t5y 我找到问题了,我的样式中设置 scrollbar-width:thin ,这个样式之前是火狐才生效,现在 chrome 也生效了,我用了 5 楼的办法,加了火狐才能识别的查询,就 ok 了。
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   2579 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 25ms · UTC 11:02 · PVG 19:02 · LAX 03:02 · JFK 06:02
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.