CSS实现隐藏滚动条但是可以滚动

简介: CSS实现隐藏滚动条但是可以滚动

今天记录一个很小的问题,在工作之中会经常遇到的,当页面元素溢出的时候会产生滚动条,这个时候需要页面样式优化:CSS实现隐藏滚动条但是可以滚动。

body::-webkit-scrollbar {
    display: none;
}

示例代码

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <style>
            .cont {
                width: 200px;
                height: 200px;
                border: 1px solid #000000;
                overflow-x: hidden;
            }
            .cont::-webkit-scrollbar {
                display: none;
            }
        </style>
    </head>
    <body>
        <div class="cont">
            <p>王小婷</p>
            <p>王小婷</p>
            <p>王小婷</p>
            <p>王小婷</p>
            <p>王小婷</p>
            <p>王小婷</p>
        </div>
    </body>
</html>
相关文章
|
2月前
|
前端开发 JavaScript API
|
4月前
|
前端开发
CSS 隐藏滚动条
CSS 隐藏滚动条
|
4月前
|
前端开发
纯css实现滚动(滑动)区域
项目需求: 实现天气24小时预报,类似于华为等天气app,有个可以滑动的区域 完成效果
38 0
|
5月前
|
JSON 前端开发 数据格式
CSS横向滚动条自定义样式
CSS横向滚动条自定义样式
46 0
|
5月前
|
JSON 前端开发 数据格式
CSS横向滚动条实现
CSS横向滚动条实现
51 0
|
5月前
|
前端开发
css大屏滚动展示样式
css大屏滚动展示样式
27 0
|
5月前
|
前端开发
CSS自定义滚动条样式
CSS自定义滚动条样式
27 0
|
5月前
|
前端开发
通过CSS来设置页面滚动条
通过CSS来设置页面滚动条
33 0
|
5月前
|
前端开发
css滚动到顶部自动固定
css滚动到顶部自动固定
|
5月前
|
前端开发
前端切图:CSS实现隐藏滚动条同时又可以滚动
前端切图:CSS实现隐藏滚动条同时又可以滚动
28 0