首页 > 其他分享 >浏览器滚动条css设置webkit-scrollbar样式方式

浏览器滚动条css设置webkit-scrollbar样式方式

时间:2022-10-13 15:57:06浏览次数:90  
标签:body 样式 滚动条 scrollbar webkit border

样式代码示例

  body::-webkit-scrollbar {
    width: 12px;
    height: 12px;
  }

  body::-webkit-scrollbar:horizontal {
    border-top: 1px solid #efefef;
  }
  body::-webkit-scrollbar:vertical {
    border-left: 1px solid #efefef;
  }

  body::-webkit-scrollbar-thumb {
    background-color: rgba(14,133,252,1);
    border-radius: 15px;
  }

  body::-webkit-scrollbar-track-piece {
    background-color: rgba(14,133,252,.2);
  }

参数的说明把参考地址看完后,你就会了。

参考地址

MDN --webkit-scrollbar-xxx 滚动条设置样式
对滚动条样式设置的详细可用参数

标签:body,样式,滚动条,scrollbar,webkit,border
From: https://www.cnblogs.com/XingXiaoMeng/p/16788402.html

相关文章