IT序号网

火狐浏览器滚动条的样式问题

leader 2021年05月25日 程序员 335 0

网上查了很多关于修改火狐浏览器样式的资料,发现千篇一律,能解决问题的可以说没有。

当然一番搜寻下来也不是没有收获,为了节省广大前端同学不再耗费时间在这上面,特此记录。解决了在火狐浏览器下滚动条的部分样式问题,当然有更好的解决办法欢迎留言~~~

基于webkit的浏览器:

  /* 滚动条样式 */ 
  ::-webkit-scrollbar{ 
    width: 4px; 
    height: 6px; 
  } 
  ::-webkit-scrollbar-thumb{ 
    border-radius: 1em; 
    background-color: rgba(50,50,50,.3); 
  } 
  ::-webkit-scrollbar-track{ 
    border-radius: 1em; 
    background-color: rgba(50,50,50,.1); 
  }

火狐:

overflow-y: scroll; 
scrollbar-color: transparent transparent; 
scrollbar-track-color: transparent; 
-ms-scrollbar-track-color: transparent;

可以实现火狐浏览器下滚动条的隐藏。

参考地址  https://stackoverflow.com/questions/6165472/custom-css-scrollbar-for-firefox/54101063#54101063


评论关闭
IT序号网

微信公众号号:IT虾米 (左侧二维码扫一扫)欢迎添加!