这篇文章主要介绍了某视频剪辑软件修改滚动条样式，首先要知道，修改滚动条样式，利用伪元素-网络工具包-滚动条。下面来看看文章内容的具体实现吧
目录
首先要知道，修改滚动条样式，利用伪元素-网络工具包-滚动条。
注意，-网络工具包-滚动条仅仅支持网络工具包的浏览器（例如谷歌铬合金，苹果野生动物园).
其次还需要了解滚动条的一些组成：
:-网络工具包-滚动条滚动条整体部分，可以设置宽度等
:-网络工具包-滚动条-缩略图滚动条里面的滑块
:-网络工具包-滚动条-按钮滚动条轨道两端的按钮，允许通过点击以微调滑块的位置
:-网络工具包-滚动条-跟踪滚动条的轨道（里面装有拇指)
:-网络工具包-滚动条-跟踪件滚动条没有滑块的轨道部分
:-网络工具包-滚动条-角落当同时有垂直滚动条和水平滚动条时的交汇处
:-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；边距：16pxclass=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修改滚动条样式的更多信息，请搜索我们以前的文章或继续浏览下面的相关文章。希望大家以后能多多支持我们！
