CSS3改变浏览器中的滚动条样式用什么方�

Admin 2022-06-22 群英技术资�

很多朋友都对“CSS3改变浏览器中的滚动条样式用什么方法”的内容比较感兴趣,对此小编整理了相关的知识分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获,那么感兴趣的朋友就继续往下看吧!

  


注:该方法只适用� -webkit- 内核浏览�

浏览器滚动条太宽,太丑,影响日常开发怎么办,改TA

滚动条外观由2部分组成�1.滚动条整体滑� 2.滚动条滑轨内滑块

在CSS中滚动条�3部分组成

name::-webkit-scrollbar //滚动条整体样�

name::-webkit-scrollbar-track //滚动条滑�

name::-webkit-scrollbar-thumb //滚动条内部滑�

注:以上3个均为伪类,请将name更改为需要改变的元素名称

例如:改变整体页面的滚动条样式

body::-webkit-scrollbar{ //先改变body的滚动条宽度

width: 8px;

}

body::-webkit-scrollbar-track{//再改变body的滚动条轨道颜色

background: rgb(200, 200, 200);

border-radius: 5px;

}

body::-webkit-scrollbar-thumb{//最后改变body的滚动条滑轨相关的样�

background: rgb(120, 120, 120);

border-radius: 5px;

}

� 右侧为上部代码更改后的滚动条样式

� 可在样式中添加背景、透明度,边框,圆角等属性,使浏览器更美�


以上就是关于“CSS3改变浏览器中的滚动条样式用什么方法”的相关知识,感谢各位的阅读,想要掌握这篇文章的知识点还需要大家自己动手实践使用过才能领会,如果想了解更多相关内容的文章,欢迎关注群英网络,小编每天都会为大家更新不同的知识�

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:[email protected]进行举报,并提供相关证据,查实之后,将立刻删除涉嫌侵权内容�

猜你喜欢

成为群英会员,开启智能安全云计算之旅

立即注册
专业资深工程师驻�
7X24小时快速响�
一站式无忧技术支�
免费备案服务
免费拨打  400-678-4567
免费拨打  400-678-4567 免费拨打 400-678-4567 � 0668-2555555
在线客服
微信公众号
返回顶部
返回顶部 返回顶部