多浏览器隐藏原生滚动条

最新推荐文章于 2025-03-18 11:13:08 发布

小谈弹

最新推荐文章于 2025-03-18 11:13:08 发布

阅读量296

点赞数

分类专栏： html 文章标签：前端

本文链接：https://blog.youkuaiyun.com/weixin_41990258/article/details/123878951

版权

html 专栏收录该内容

1 篇文章

订阅专栏

这篇博客详细介绍了如何使用CSS来隐藏浏览器的滚动条，包括针对Firefox、Chrome以及IE/Edge的兼容性处理。通过设置`scrollbar-width`、`::-webkit-scrollbar`和`-ms-overflow-style`等属性，可以实现跨浏览器的滚动条隐藏效果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

.el-scrollbar__wrap {
    // 隐藏原生滚动条
    // 火狐
    scrollbar-width: none;
    // 谷歌
    &::-webkit-scrollbar {
      display: none;
    }

    &::-webkit-scrollbar-thumb {
      display: none;
    }
    // IE, Edge
    -ms-overflow-style: none;
  }
}