css怎么修改滚动条箭头样式

小编给大家分享一下css怎么修改滚动条箭头样式,希望大家阅读完这篇文章之后都有所收获、下面让我们一起去探讨吧!

在css中,可以通过“::-webkit-scrollbar”伪类选择器设置滚动条箭头样式,语法”::-webkit-scrollbar-button{属性:属性值;}”;该选择器可以设置滚动条轨道的两端按钮,允许通过点击微调小方块的位置。

本教程操作环境:windows7多系统,CSS3&, HTML5版,戴尔G3电脑。

:: -webkit-scrollbar css伪类选择器影响了一个元素的滚动条的样式,仅仅在支持WebKit的浏览器(例如,谷歌Chrome,苹果Safari)可以使用。

可修改滚动条css:

::-webkit-scrollbar 作用;整个滚动条。 　　::-webkit-scrollbar-button 安康;滚动条上的按钮,(上下箭头)。 　　::-webkit-scrollbar-thumb 安康;滚动条上的滚动滑块。 　　::-webkit-scrollbar-track 安康;滚动条轨道。 　　::-webkit-scrollbar-track-piece 安康;滚动条没有滑块的轨道部分。 　　::-webkit-scrollbar-corner 作用;当同时有垂直滚动条和水平滚动条时交汇的部分。 　　::-webkit-resizer 安康;某些元素的角落部分的部分样式(例:textarea的可拖动按钮)。

例子:给类=發eft-nav"的div,修改滚动条箭头样式

::-webkit-scrollbar-button  { 　　,,,显示:,块,, 　　}, 　　::-webkit-scrollbar-button:横向:单键:start  { 　　,,,宽度:,24 px;,, 　　,,,背景:,url (. ./img/scroll_btn.png"“), 0, -52 px 不再重演; 　　,,,光标:,指针; 　　} 　　::-webkit-scrollbar-button:横向:单键:最终获得{ 　　,,,宽度:,24 px;,,,, 　　,,,背景:,url (. ./img/scroll_btn.png"“), 0, -77 px 没有重演,,,,, 　　,,,光标:,指针; 　　} 　　::-webkit-scrollbar-button:垂直:单键:start  { 　　,,,宽度:,16 px;,,,, 　　,,,背景:,url (. ./img/scroll_btn.png"“), 3 px  0 px 没有重演,,,,, 　　,,,光标:,指针; 　　} 　　::-webkit-scrollbar-button:垂直:单键:最终获得{ 　　,,,宽度:,16 px;,,,, 　　,,,背景:,url (. ./img/scroll_btn.png"“), 3 px  -26 px 没有重演,,,,, 　　,,,光标:,指针; 　　} css的选择器有哪些

css的选择器可以分为三大类,即id选择器,类选择器,标签选择器。它们之间可以有多种组合,有后代选择器,子选择器,伪类选择器,通用选择器,群组选择器等等

看完了这篇文章,相信你对“css怎么修改滚动条箭头样式”有了一定的了解,如果想了解更多相关知识,欢迎关注行业资讯频道,感谢各位的阅读!

css怎么修改滚动条箭头样式