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

        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热亚洲色精品国产88| 在线亚洲欧美中文精品| 久久久精品久久久久特色影视| 日本精品卡一卡2卡3卡四卡| 久久精品国产亚洲av水果派| 亚洲综合精品网站在线观看| 精品日本一区二区三区在线观看| 久久久91精品国产一区二区三区| 国产精品免费观看调教网| 亚洲AV永久精品爱情岛论坛| 无码精品第一页| 麻豆精品国产自产在线观看一区| 国产成人精品视频2021| 青青草国产精品久久久久| 国产91久久精品一区二区| 精品国产乱码久久久久久1区2区| 中国精品18videosex性中国| 香蕉依依精品视频在线播放 | 99精品国产在热久久无毒不卡| 亚洲精品无码午夜福利中文字幕 | 国产999精品久久久久久| 精品久久久久久久| 99久久国产综合精品麻豆| 91精品国产91久久综合| 精品国产乱码久久久久久郑州公司| 日产精品久久久一区二区| 亚洲Av永久无码精品三区在线| 免费看一级毛片在线观看精品视频 | 无码精品黑人一区二区三区 | 国产精品推荐天天看天天爽| 99热这里只有精品国产66| 69堂午夜精品视频在线| 国产高清在线精品一区小说| 国产精品 猎奇 另类视频| 国产这里有精品| 日韩福利视频精品专区|