css怎么修改滾動條箭頭樣式

小編給大家分享一下css怎么修改滾動條箭頭樣式，希望大家閱讀完這篇文章之后都有所收獲，下面讓我們一起去探討吧！

創(chuàng)新互聯(lián)主營姑蘇網(wǎng)站建設(shè)的網(wǎng)絡(luò)公司,主營網(wǎng)站建設(shè)方案,成都app軟件開發(fā)公司,姑蘇h5小程序制作搭建,姑蘇網(wǎng)站營銷推廣歡迎姑蘇等地區(qū)企業(yè)咨詢

在css中，可以通過“::-webkit-scrollbar”偽類選擇器設(shè)置滾動條箭頭樣式，語法“::-webkit-scrollbar-button{屬性:屬性值;}”；該選擇器可以設(shè)置滾動條軌道的兩端按鈕，允許通過點(diǎn)擊微調(diào)小方塊的位置。

本教程操作環(huán)境：windows7系統(tǒng)、CSS3&&HTML5版、Dell G3電腦。

::-webkit-scrollbar CSS偽類選擇器影響了一個(gè)元素的滾動條的樣式，僅僅在支持WebKit的瀏覽器 (例如, 谷歌Chrome, 蘋果Safari)可以使用。

可修改滾動條css：

::-webkit-scrollbar — 整個(gè)滾動條.
::-webkit-scrollbar-button — 滾動條上的按鈕 (上下箭頭).
::-webkit-scrollbar-thumb — 滾動條上的滾動滑塊.
::-webkit-scrollbar-track — 滾動條軌道.
::-webkit-scrollbar-track-piece — 滾動條沒有滑塊的軌道部分.
::-webkit-scrollbar-corner — 當(dāng)同時(shí)有垂直滾動條和水平滾動條時(shí)交匯的部分.
::-webkit-resizer — 某些元素的corner部分的部分樣式(例:textarea的可拖動按鈕).

例子：給 class="left-nav"的div,修改滾動條箭頭樣式

::-webkit-scrollbar-button {
    display: block; 
} 
::-webkit-scrollbar-button:horizontal:single-button:start {
    width: 24px;  
    background: url("../img/scroll_btn.png") 0 -52px no-repeat;
    cursor: pointer;
}
::-webkit-scrollbar-button:horizontal:single-button:end {
    width: 24px;    
    background: url("../img/scroll_btn.png") 0 -77px no-repeat;    
    cursor: pointer;
}
::-webkit-scrollbar-button:vertical:single-button:start {
    width: 16px;    
    background: url("../img/scroll_btn.png") -3px 0px no-repeat;    
    cursor: pointer;
}
::-webkit-scrollbar-button:vertical:single-button:end {
    width: 16px;    
    background: url("../img/scroll_btn.png") -3px -26px no-repeat;    
    cursor: pointer;
}

css的選擇器有哪些

css的選擇器可以分為三大類，即id選擇器、class選擇器、標(biāo)簽選擇器。它們之間可以有多種組合，有后代選擇器、子選擇器、偽類選擇器、通用選擇器、群組選擇器等等

看完了這篇文章，相信你對“css怎么修改滾動條箭頭樣式”有了一定的了解，如果想了解更多相關(guān)知識，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道，感謝各位的閱讀！

當(dāng)前標(biāo)題：css怎么修改滾動條箭頭樣式
鏈接地址：http://muchs.cn/article0/piosio.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供搜索引擎優(yōu)化、自適應(yīng)網(wǎng)站、用戶體驗(yàn)、云服務(wù)器、做網(wǎng)站、電子商務(wù)

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源： 創(chuàng)新互聯(lián)