Vue后台项目中如何去除左侧菜单栏滚动条

原创已于 2022-12-06 10:41:06 修改 · 1.6k 阅读

3 ·

CC 4.0 BY-SA版权

文章标签：

#vue.js #javascript #前端

于 2022-05-06 16:28:28 首次发布

这篇博客主要介绍了如何使用CSS来隐藏侧边栏菜单下方的滚动条，通过设置`overflow-x:hidden`和`scrollbar-width:none`以及Webkit特定的样式，实现了在不同浏览器中统一隐藏滚动条的效果，保持界面整洁。

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

要解决的问题: 去掉侧边栏菜单下面出现的滚动条,如图:

代码：

.el-aside {
  overflow-x: hidden;
  min-height: calc(100vh - 60px);
  background: linear-gradient(0deg, #0056ae 0%, #10385c 100%);
  position: fixed;
  top: 60px;
  left: 0;
  bottom: 0;
  z-index: 999;
  scrollbar-width: none;
  &::-webkit-scrollbar {
    display: none;
  }
}