滚动条样式css

深藏阁楼爱情的钟 2021-12-18 13:37 572阅读 0赞

在这里插入图片描述

/** 滚动条 **/
::-webkit-scrollbar { 
  width: 6px;    
  height: 8px;
}
::-webkit-scrollbar-button:vertical { 
  display: none;
}
::-webkit-scrollbar-track, ::-webkit-scrollbar-corner { 
  background-color: #e2e2e2;
}
::-webkit-scrollbar-thumb { 
  border-radius: 10px;
  background-color: rgba(0, 0, 0, .3);
}
::-webkit-scrollbar-thumb:vertical:hover { 
  background-color: rgba(0, 0, 0, .35);
}
::-webkit-scrollbar-thumb:vertical:active { 
  background-color: rgba(0, 0, 0, .38);
}

发表评论取消回复

表情：

评论列表（有 0 条评论，572人围观）

还没有评论，来说两句吧...

相关阅读

相关 css 修改浏览器滚动条样式

本文是基于谷歌浏览器将原有的滚动条样式进行修改，修改结果如下所示。 ![在这里插入图片描述][20200107161430244.png] 代码如下： <sty

Love The Way You Lie/ 2023年06月28日 04:59/ 0 赞/ 219 阅读

相关滚动条css样式

<style lang="scss"> ::-webkit-scrollbar-track { background: rgba(0, 0, 0,

小灰灰/ 2023年02月11日 08:46/ 0 赞/ 151 阅读

相关 css修改滚动条样式

HTML代码： <div class="element"> 内容 </div> CSS代码： .element{ over

今天药忘吃喽~/ 2023年01月01日 01:41/ 0 赞/ 358 阅读

相关 css设置滚动条样式

css设置滚动条样式先看效果图 ![70][] 附上效果图代码： 1. `1.style部分` 2. `<style>` 3. `/定义

约定不等于承诺〃/ 2022年12月28日 08:00/ 0 赞/ 314 阅读

相关 css自定义滚动条样式

代码 css自定义滚动条样式，webkit内核浏览器。 / 滚动条样式 / ::-webkit-scrollbar { / 滚动条的宽度 / width

偏执的太偏执、/ 2022年05月25日 11:05/ 0 赞/ 436 阅读

相关好看的滚动条样式 css改变默认滚动条样式

通过css改变滚动条样式可修改滚动条css： ::-webkit-scrollbar — 整个滚动条. ::-webkit-scrollbar-butto

迷南。/ 2022年03月22日 02:18/ 0 赞/ 866 阅读

相关滚动条样式css

![在这里插入图片描述][20190702143854151.png] / 滚动条 / ::-webkit-scrollbar { width:

深藏阁楼爱情的钟/ 2021年12月18日 13:37/ 0 赞/ 573 阅读

相关 css如何修改滚动条样式

默认滚动条样式如下： ![70][] 那如何修改呢？如下代码： <div class="inner"> <div class="innerbox

朱雀/ 2021年12月13日 05:02/ 0 赞/ 607 阅读

相关 css3定义滚动条样式

/定义滚动条高宽及背景高宽分别对应横竖滚动条的尺寸/ ::-webkit-scrollbar { width: 16px;

墨蓝/ 2021年07月26日 17:20/ 0 赞/ 594 阅读

相关 css 定义滚动条样式

在使用了overflow产生滚动条的选择器里,只对谷歌浏览器有效选择器::-webkit-scrollbar 滚动条整体部分设置dis

小灰灰/ 2021年07月25日 02:54/ 0 赞/ 736 阅读