自己 inset lac col some ons 行動 one rac

配置H5的滾動條樣式示例代碼有不少的小夥伴在網上尋找，本篇文章好程序員小編和大家分享一下配置H5的滾動條樣式示例代碼，希望對HTML5開發感興趣的小夥伴有所幫助，下面我們一塊來看一下吧：
/?滾動條的滑軌背景顏色?/
::-webkit-scrollbar-track {
background-color: #b46868;
}
/?滑塊顏色?/
::-webkit-scrollbar-thumb {
background-color: rgba(0, 0, 0, 0.2);
}
/?滑軌兩頭的監聽按鈕顏色?/
::-webkit-scrollbar-button {
background-color: #7c2929;
}
/?橫向滾動條和縱向滾動條相交處尖角的顏色?/
::-webkit-scrollbar-corner {
background-color: black;
}
// IE 自己的設置方法，並且是第一個可以自定義滾動條的瀏覽器，從IE5.5開始兼容
body {
scrollbar-face-color: #b46868;
}
舉例
/?Document scrollbar?/
::-webkit-scrollbar {
width: 8px;
}
::-webkit-scrollbar-track {
box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
border-radius: 10px;
}
::-webkit-scrollbar-thumb {
border-radius: 10px;
box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5);
}
/?Scrollable element?/
.some-element::webkit-scrollbar {
}
Lorem ipsum dolor sit amet consectetur adipisicing elit. Iure id exercitationem nulla qui repellat laborum vitae, molestias tempora velit natus. Quas, assumenda nisi. Quisquam enim qui iure, consequatur velit sit?
以上就是好程序員HTML5教程小編給大家分享的配置H5的滾動條樣式示例代碼，想要了解更多內容的小夥伴可以登錄好程序員官網咨詢，好程序員是專業的HTML5培訓機構，不僅有專業的老師和與時俱進的課程體系，還有大量的HTML5視頻教程供學員觀看學習，想要學好HTML5開發技術的小夥伴快快行動吧。

好程序員教程之配置H5的滾動條樣式示例代碼