这篇文章主要介绍了某视频剪辑软件修改滚动条样式，首先要知道，修改滚动条样式，利用伪元素-网络工具包-滚动条。下面来看看文章内容的具体实现吧
目录
首先要知道，修改滚动条样式，利用伪元素-网络工具包-滚动条。
注意，-网络工具包-滚动条仅仅支持网络工具包的浏览器（例如谷歌铬合金，苹果野生动物园).
其次还需要了解滚动条的一些组成：
:-网络工具包-滚动条滚动条整体部分，可以设置宽度等
:-网络工具包-滚动条-缩略图滚动条里面的滑块
:-网络工具包-滚动条-按钮滚动条轨道两端的按钮，允许通过点击以微调滑块的位置
:-网络工具包-滚动条-跟踪滚动条的轨道（里面装有拇指)
:-网络工具包-滚动条-跟踪件滚动条没有滑块的轨道部分
:-网络工具包-滚动条-角落当同时有垂直滚动条和水平滚动条时的交汇处
:-webkit-resizer某些元素的角落部分（如文本区域的可拖动按钮)
对此有了一些了解之后就可以上手滚动条样式的修改了。
代码实现：
ul class='导航-标签-滚动'
li v-for='(item，index)in tabs ':key=' index ' class=' nav-item-scroll ' {
！-{项目。text } }/李
/ul
v-文本区域概述v-model=' text ' style=' width:200 px；边距：16px'class='text'/v-textarea
数据：()=({
选项卡：[
{值：4001,文本：'贷款日志，代码：'贷款_日志' },
{值：4002,文本：'文档日志，代码：' DOCUMENT_LOG' }，
{值：4003,文本：'便笺日志'，代码：'注释日志' }，
{值：4004,文本：'操作日志，代码：' OPERATION_LOG' }，
{值：4005,文本：'支付日志，代码：'支付日志' }，
{值：4006,文本：'维护日志，代码：'维护日志' }，
{值：4007,文本：'事务日志，代码：'事务日志' },
{值：4008,文本：'收集日志，代码：'收集日志' },
{值：4001,文本：'贷款日志，代码：'贷款_日志' },
{值：4002,文本：'文档日志，代码：' DOCUMENT_LOG' }，
{值：4003,文本：'便笺日志'，代码：'注释日志' }，
{值：4004,文本：'操作日志，代码：' OPERATION_LOG' }，
{值：4005,文本：'支付日志，代码：'支付日志' }，
{值：4006,文本：'维护日志，代码：'维护日志' }，
{值：4007,文本：'事务日志，代码：'事务日志' },
{值：4008,文本：'收集日志，代码：'收集日志' },
{值：4001,文本：'贷款日志，代码：'贷款_日志' },
{值：4002,文本：'文档日志，代码：' DOCUMENT_LOG' }，
{值：4003,文本：'便笺日志'，代码：'注释日志' }，
{值：4004,文本：'操作日志，代码：' OPERATION_LOG' }，
{值：4005,文本：'支付日志，代码：'支付日志' }，
{值：4006,文本：'维护日志，代码：'维护日志' }，
{值：4007,文本：'事务日志，代码：'事务日志' },
{值：4008,文本："收集日志",代码："收集日志"}
],
文本：""
}),
样式lang='scss '范围。导航-标签-滚动{
高度：100像素
列表样式：无；
边距：0px
填充：16px 0；
溢出-x:自动；
显示：内嵌-块；
空白：nowrap
宽度：100%;
背景：# F9FAFD
}。导航项目滚动{
背景：# e 5 f 0 ff
颜色：# 24252E
字体大小：12px
字体粗细：400;
行高：16px
填充：8像素8像素180像素
文本对齐：居中；
显示：内嵌；
保证金：0 4px 0
边框半径：16px
}。导航-标签-滚动：-网络工具包-滚动条{
宽度：20px
高度：10px
}。导航-标签-滚动：-网络工具包-滚动条-缩略图{
边框半径：5px
背景：红色；
}。导航-标签-滚动：-网络工具包-滚动条-按钮{
宽度：10px
边界半径：50%;
背景：黑色；
}。导航-标签-滚动：-网络工具包-滚动条-跟踪{
方框阴影：插图0 0 2px # 333
边框半径：5px
背景：蓝色；
}。导航-标签-滚动：-网络工具包-滚动条-角落{
背景：springgreen
}
/*。导航-标签-滚动：-网络工具包-滚动条-跟踪-件{
方框阴影：inset 0 0 2px # 333
边框半径：5px
背景：梅子；
}
*/
/风格
风格
. text . v-textarea textarea:-WebKit-resizer {
背景：粉色；
}
/风格
默认的样式：
修改后的样式：
关于vue修改滚动条样式的方法的这篇文章就到这里了。有关vue修改滚动条样式的更多信息，请搜索我们以前的文章或继续浏览下面的相关文章。希望大家以后能多多支持我们！
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。