本文摘自PHP中文网,作者藏色散人,侵删。
设置滚动条的方法:1、使用overflow属性设置是否出现滚动条,代码如“overflow:scroll”;2、使用scrollbar属性设置滚动条样式即可。
本文操作环境:windows7系统、HTML5&&CSS3版、Dell G3电脑。
使用css设置滚动条的方法
一、我们可以使用overflow属性设置是否出现滚动条
1 2 3 4 5 |
|
当块级内容区域超出块级元素范围的时候,就会以滚动条的形式展示,你可以滚动里面的内容,里面的内容不会超出块级区域范围。
二、使用scrollbar属性设置滚动条样式
::-webkit-scrollbar 滚动条整体部分
::-webkit-scrollbar-button 滚动条两端的按钮
::-webkit-scrollbar-track 外层轨道
::-webkit-scrollbar-track-piece 内层轨道,滚动条中间部分(除去)
::-webkit-scrollbar-thumb 滚动条里面可以拖动的那个
::-webkit-scrollbar-corner 边角
::-webkit-resizer 定义右下角拖动块的样式
示例:
相关阅读 >>
更多相关阅读请进入《滚动条》频道 >>
Vue.js 设计与实现 基于Vue.js 3 深入解析Vue.js 设计细节
本书对 Vue.js 3 技术细节的分析非常可靠,对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪,Vue.js作者