学堂 学堂 学堂公众号手机端

常规修改滚动条样式

lewis 1年前 (2024-03-07) 阅读数 4 #技术

/定义滚动条样式(高宽及背景)/
::-webkit-scrollbar {
width: 7px; / 滚动条宽度, width:对应竖滚动条的宽度 height:对应横滚动条的高度/
background: #fff;
box-shadow: 0;
}

/定义滚动条轨道(凹槽)样式/
::-webkit-scrollbar-track {
// -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); / 较少使用 /
border-radius: 3px;
}

/定义滑块 样式/
::-webkit-scrollbar-thumb {
border-radius: 3px;
// height: 100px; / 滚动条滑块长度 /
background-color: #ccc;
}


版权声明

本文仅代表作者观点,不代表博信信息网立场。

热门