ios端隐藏滚动条

子元素

 	padding-bottom: 60px;// 滚动条向下移,外层盒子给定高overflow:hidden,解决ios无法隐藏滚动条问题
   box-sizing: border-box;
   overflow-x: scroll;
   /*解决ios上滑动不流畅*/
   -webkit-overflow-scrolling: touch;
   /*纵向超出部分将会隐藏,即滚动条部分被挤出可视区域*/
   overflow-y: hidden;
   scrollbar-width: none; /* firefox */
   -ms-overflow-style: none; /* IE 10+ */
   &::-webkit-scrollbar {
       display: none;
       width: 0px;
   }
   &::-webkit-scrollbar {
       display: none;
   }
   &::-webkit-scrollbar-track {
       background-color: none;
   }
   &::-webkit-scrollbar-thumb {
       background-color: none;
   }
   &::-webkit-scrollbar-thumb:hover {
       background-color: none;
   }
   &::-webkit-scrollbar-thumb:active {
       background-color: none;
   }

父元素

   // 滚动条外部元素设置定高,内内部元素超出定高,可以达到隐藏滚动条;
   height: 196px;
   overflow: hidden;
上一篇:浏览器滚动条样式设置


下一篇:el-table自定义滚动条样式