当前位置:网站首页>滚动条 scrollbar 和scrollbar-thumb 样式
滚动条 scrollbar 和scrollbar-thumb 样式
2022-08-03 05:22:00 【tengyuxin】
效果图如下

具体代码如下
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
.box{
height: 400px;
width: 400px;
background-color: aquamarine;
overflow-y: scroll;
}
.box p{
height: 150px;
}
/*修饰滚动条写法*/
.box::-webkit-scrollbar {
background-color: rgb(122, 178, 238);
width: 20px;
}
.box::-webkit-scrollbar-thumb{
border-radius:5px;
background-color:rgb(19, 80, 142);
width: 11px;
}
</style>
</head>
<body>
<div class="box">
<p>小李子</p>
<p>小李子</p>
<p>小李子</p>
<p>小李子</p>
</div>
</body>
</html>
边栏推荐
- mysql 客户端SSL错误2026 (HY000)
- 【IDEA】字体修改-护眼主题-文件注释头设置
- Oracle 分区索引详解(local、global)
- php连接数据库脚本
- Invalid signature file digest for Manifest main attributes解决方法
- Execute the mysql script file in the docker mysql container and solve the garbled characters
- Leetcode刷题——一些用层次遍历解决的问题(111. 二叉树的最小深度、104. 二叉树的最大深度、226. 翻转二叉树、剑指 Offer 27. 二叉树的镜像)
- 联邦学习摘录
- 解析各种文本的年月日
- 动态调整web系统主题? 看这一篇就够了
猜你喜欢
随机推荐
边缘辅助无人机网络的分层联邦学习
【IDEA】字体修改-护眼主题-文件注释头设置
【DC-5靶场渗透】
中国柔性制造系统(FMS)市场发展动态及未来趋势预测报告2022~2028年
The ` monorepo ` ` hoist ` mechanism lead to the change of the loading configuration file path
当我们在看Etherscan的时候,到底在看什么?
7.7(5)
MySql 怎么查出符合条件的最新的数据行?
A-B数对问题|UPC-Count Interval|洛谷-P1102A-B数对
网卡软中断过高问题优化总结
中国生物降解塑料行业市场运营态势及发展趋势研究报告2022~2028年
编写一个函数 reverse_string(char * string)(两种方法实现)7.26
MySQL 索引详解和什么时候创建索引什么时候不适用索引
Navicat 解决隔一段时间不操作出现延时卡顿问题
Kettle 从资源库中载入新的转换出错(Invalid byte 1 of 1-byte UTF-8 sequence)
Qlik Sense 临时处理表数据详解(Resident)
【Yarn】yarn常用命令 查看日志和Kill任务
Django从入门到放弃三 -- cookie,session,cbv加装饰器,ajax,django中间件,redis缓存等
【解读合约审计】Harmony的跨链桥是如何被盗一亿美金的?
中国聚氯乙烯(PVC)土工膜发展动态及投资前景预测报告2022~2028年









