站長資訊網
        最全最豐富的資訊網站

        css中的滑動條怎么隱藏

        css中的滑動條隱藏的方法是,設置【overflow:hidden】即可。如果我們要隱藏滾動條并在內容溢出時顯示,只需要設置【overflow:auto】即可。

        css中的滑動條怎么隱藏

        本文操作環境:windows10系統、css 3、thinkpad t480電腦。

        首先,如果需要隱藏滾動條并在內容溢出時顯示滾動條,只需要設置overflow:auto樣式即可。想要完全隱藏滾動條只需設置overflow:hidden即可,但是這樣一來將導致元素內容不可滾動。時至今日,還沒有任何一條CSS規則可以使元素可以隱藏滾動條的同時依然可以滾動內容,只能通過針對特定瀏覽器設置滾動條樣式來實現。

        Firefox瀏覽器

        對于Firefox,我們可以將滾動條寬度設置為none:

        scrollbar-width: none; /* Firefox */

        IE瀏覽器

        對于IE,我們需要使用-ms-prefix屬性定義滾動條樣式:

        -ms-overflow-style: none; /* IE 10+ */

        Chrome和Safari瀏覽器

        對于Chrome和Safari瀏覽器,我們必須使用CSS滾動條選擇器,然后使用display:none隱藏它:

        ::-webkit-scrollbar {   display: none; /* Chrome Safari */}

        注意:當你要隱藏滾動條的時候,最好將overflow顯示設置為auto或者scroll保證內容是可滾動的。

        示例:

        我們使用上面的CSS屬性以及溢出實現下面一個實例——隱藏水平滾動條,同時允許垂直滾動條:

        .demo::-webkit-scrollbar {   display: none; /* Chrome Safari */ }  .demo {   scrollbar-width: none; /* firefox */   -ms-overflow-style: none; /* IE 10+ */   overflow-x: hidden;   overflow-y: auto; }

        相關視頻分享:css視頻教程

        贊(0)
        分享到: 更多 (0)
        網站地圖   滬ICP備18035694號-2    滬公網安備31011702889846號
        主站蜘蛛池模板: 午夜精品福利视频| 久久精品无码一区二区三区免费 | 久久99国产精品久久99| 中文字幕精品无码一区二区三区| 亚洲国语精品自产拍在线观看| 久久亚洲精品成人AV| 日韩精品无码久久一区二区三| 99久久精品国产一区二区蜜芽| 国产午夜精品一区二区三区 | 国产精品久久99| 精品三级AV无码一区| 在线观看亚洲精品福利片| 精品国产午夜福利在线观看| 久久亚洲精品视频| 国产精品精品自在线拍| 亚洲精品中文字幕无码蜜桃| 免费看污污的网站欧美国产精品不卡在线观看| 99久久精品九九亚洲精品| 国产一区二区精品久久| 99精品视频免费| 国产精品乱码高清在线观看| 日韩精品无码专区免费播放| 亚洲国产高清精品线久久| 久久se精品一区精品二区国产| 国产精品va在线观看无码| 97视频在线精品国自产拍| 日韩精品国产自在久久现线拍| 精品亚洲综合久久中文字幕| 精品国内片67194| 国产精品嫩草影院一二三区入口| 国产AV午夜精品一区二区三区 | HEYZO无码综合国产精品227| 久久精品无码专区免费青青| 日韩精品无码AV成人观看| 亚洲国产精品SSS在线观看AV| 中文字幕日韩精品无码内射| 无码精品人妻一区二区三区AV| 无码精品人妻一区| 亚洲精品成人网站在线观看| 无码人妻精品一区二区三区66 | 一本色道久久88综合日韩精品|