CSS 自定義滾動條

2021-10-25 03:33:37 字數 610 閱讀 3968

瀏覽器允許自定義滾動條,ie也可以改變預設的樣色,不過效果不明顯。

常見谷歌瀏覽器滾動條修改:

::-webkit-scrollbar

::-webkit-scrollbar-thumb

::-webkit-scrollbar-track

ie自定義滾動條顏色:

::-webkit-scrollbar 滾動條整體部分,可以設定寬度啥的 

::-webkit-scrollbar-button 滾動條兩端的按鈕

::-webkit-scrollbar-track 外層軌道

::-webkit-scrollbar-track-piece 內層軌道,滾動條中間部分(除去)

::-webkit-scrollbar-thumb 拖動條,滑塊

::-webkit-scrollbar-corner 邊角

::-webkit-resizer 定義右下角拖動塊的樣式 */

css自定義滾動條

1 在谷歌瀏覽器和safari中可直接設定,如果想單獨對某個盒子新增,直接在偽類前面加上選擇器即可 滾動條的軌道 滾動條的滑塊按鈕 webkit scrollbar track,webkit scrollbar thumb 滾動條的上下兩端的按鈕 webkit scrollbar button we...

CSS自定義滾動條

乙個類名為parent的容器包裹了一些lorem。lorem ipsum dolor sit amet consectetur adipisicing elit.iusto,delectus libero cupiditate sapiente excepturi,ea hic,exercitati...

css 自定義滾動條

我遇到的場景 對於iframe視窗,自帶滾動條是整個視窗的大小。有時需要頂部或底部固定,則滾動條不應該觸碰到頂部或底部。那麼首先開啟iframe時應該去掉滾動條 scrolling no 然後在需要滾動的區域自定義滾動條。iframe frameborder 0 scrolling no src i...