vue学习笔记 el-scrollbar 隐藏横向滚动条

xjcwzp

于 2021-08-11 16:02:50 发布

阅读量887

点赞数 2

分类专栏： Vue

本文链接：https://blog.csdn.net/xjcwzp/article/details/119608754

版权

Vue 专栏收录该内容

22 篇文章 0 订阅

订阅专栏

在学习Vue的过程中，为实现侧边菜单的滚动条隐藏效果，使用了SCSS来定制样式。在`sidebar.scss`文件中，通过设置`.el-scrollbar__wrap`的`overflow-x`为`hidden!important`以及隐藏水平滚动条`.el-scrollbar__bar.is-horizontal`，成功地在侧边菜单中隐藏了横向滚动条，确保了界面的整洁。

摘要由CSDN通过智能技术生成

在学习vue过程中，学习侧边菜单，使用el-scrollbar，需要隐藏横向滚动条
在这里插入图片描述

sidebar.scss

#app {
  $sideBarWidth: 220px;
  $menuBg: #304156;
  .sidebar-container {
   ...
    //隐藏横向滚动条
    .el-scrollbar__wrap {
      overflow-x: hidden !important;
    }
    .el-scrollbar__bar.is-horizontal {
      display: none;
    }
    ...
  }
}