美文网首页
css隐藏元素滚动条兼容各大浏览器

css隐藏元素滚动条兼容各大浏览器

作者: 仰望天空的人 | 来源:发表于2023-07-18 09:38 被阅读0次
image.png

常见的场景有外层body滚动,页面内嵌表格或表单等内容过长出现滚动条,为了美观性,需要隐藏table等元素的滚动条

    /* 谷歌,元素隐藏必须设置宽度  不然无效 */
    .aa::-webkit-scrollbar {
        width: 0px;
        height: 30px;
    }

    /* 使用伪类选择器 ::-webkit-scrollbar ,兼容chrome和safari浏览器 */
    /* display: none; 只能直接作用于body html,其他元素设置宽度的方式 */
    /* .aa::-webkit-scrollbar{
        display: none;
    } */

    /* /兼容火狐/ */
    .aa {
        scrollbar-width: none;
    }
    
    /* / 兼容IE10+ */
    .aa {
        -ms-overflow-style: none;
    }

相关文章

网友评论

      本文标题:css隐藏元素滚动条兼容各大浏览器

      本文链接:https://www.haomeiwen.com/subject/bpmgudtx.html