如何使用css隐藏滚动条

如何隐藏滚动条,同时仍然可以在任何元素上滚动?

首先,如果需要隐藏滚动条并在内容溢出时显示滚动条,只需要设置overflow:auto样式即可。想要完全隐藏滚动条只需设置overflow:hidden即可,但是这样一来将导致元素内容不可滚动。时至今日,还没有任何一条CSS规则可以使元素可以隐藏滚动条的同时依然可以滚动内容,只能通过针对特定浏览器设置滚动条样式来实现。

火狐浏览器

scrollbar-width: none; /* Firefox */

ie浏览器

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

Chrome和Safari浏览器

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

详情请看 https://www.cnblogs.com/jofun/p/11158145.html

2020-02-07     15:23:09

css 隐藏滚动条的更多相关文章

  1. 实现CSS隐藏滚动条并可以滚动内容

    隐藏滚动条的同时还需要支持滚动,我们经常在前端开发中遇到这种情况,最容易想到的是加一个iscroll插件,但其实现在CSS也可以实现这个功能,我已经在很多地方使用了,下面一起看看这三种方法. 方法1: ...

  2. css隐藏滚动条

    xhtml中隐藏滚动条在用ie6浏览有框架的xhtml页面的时候,默认会水平和垂直滚动条会一起出现,这是ie6的一个bug,在firefox上是正常的,出现的原因是其对XHTML 1.0 transi ...

  3. 3种方法实现CSS隐藏滚动条并可以滚动内容

    隐藏滚动条的同时还需要支持滚动,我们经常在前端开发中遇到这种情况,最容易想到的是加一个iscroll插件,但其 实现在CSS也可以实现这个功能,我已经在很多地方使用了,下面一起看看这三种方法. 方法1 ...

  4. 如何让css隐藏滚动条 兼容谷歌、火狐、IE等各个浏览器

    项目中,页面效果需要展示一个页面的移动端效果,使用的是一个苹果手机样式背景图,咋也没用过苹果,咋也不敢形容. 如下图所示: 在谷歌浏览器如图一滚动条顺利隐藏,但是火狐就如图二了,有了滚动条丑的一批. ...

  5. css隐藏滚动条 兼容谷歌、火狐、IE等各个浏览器

    项目中,页面效果需要展示一个页面的移动端效果,使用的是一个苹果手机样式背景图,咋也没用过苹果,咋也不敢形容. 如下图所示: 在谷歌浏览器如图一滚动条顺利隐藏,但是火狐就如图二了,有了滚动条丑的一批. ...

  6. 如何使用CSS隐藏滚动条并且兼容大部分浏览器

    隐藏滚动条,已经自己实测在浏览器Chrome, IE (6+), Firefox, Opera, Safari. 如下demo: Content 1 Content 1 Content 1 Conte ...

  7. 浏览器css隐藏滚动条的方法!除了IE一般都支持

    ::-webkit-scrollbar { /* 滚动条整体部分 */ width:0px; margin-right:2px}::-webkit-scrollbar-track-piece { /* ...

  8. css隐藏滚动条依旧可以滚动

    在做企业页面的时候,大部分页面都应该是活的,不应该写死,因为要从后台拿数据进行填充.而后台的数据是不确定的,有时候会让我们的容器撑得很大.这时候我们需要隐藏掉滚动条达到美观或者其他布局效果,隐藏掉单个 ...

  9. CSS隐藏滚动条但又能滚动,不用js实现

    隐藏多余的内容,但是可以滑动查看 原理就在于padding-right:17px;把滚动条挤出去隐藏了

随机推荐

  1. [CF1192B]动态直径

    题意 给一棵固定形态的树,边有边权,每次修改一条边权,在线求出修改后树的直径. 思考 写出树的全dfs序.生成方式为:每当一个点进栈或入栈时,记录它的编号. 考虑这个dfs序上两点之间的距离.设某个节 ...

  2. python3.6的安装及cx_oracle安装

    一.创建所需目录mkdir -p /home/用户名/software/python3.6.1mkdir -p /home/用户名/priv/bydmkdir -p /home/用户名/priv/by ...

  3. P4452 [国家集训队]航班安排(最大费用最大流)

    P4452 [国家集训队]航班安排 题目传送门 解题思路: 感觉题面让人有很多误解,就是说有k架飞机在0点从0号机场起飞,在t时刻返回机场,给出空载飞行的时间和花费以及m个包机请求的花费和起始时间和终 ...

  4. SpringCloud与微服务Ⅸ --- Zuul路由网关

    一.Zool是什么 Zuul包含了对请求路由和过滤两个最主要的功能: 其中路由功能负责将外部请求转发到具体的微服务实例上,是实现外部访问统一入口的基础而过滤器功能则负责对请求的处理过程进行干预,是实现 ...

  5. 《快乐编程大本营》java语言训练班 2课:java的变量

    <快乐编程大本营>java语言训练班 2课:java的变量 1变量介绍 2变量分类,数值变量 3变量分类-字符串变量 4变量分类-布尔变量 5变量分类-对象 http://code6g.c ...

  6. JVM源码分析之警惕存在内存泄漏风险的FinalReference(增强版)

    概述 JAVA对象引用体系除了强引用之外,出于对性能.可扩展性等方面考虑还特地实现了四种其他引用:SoftReference.WeakReference.PhantomReference.FinalR ...

  7. tmobst4

    (单选题)HTML代码: <table> <tr><td>Value 1</td><td></td></tr> &l ...

  8. nmcli几个常用命令

    1.nmcli connection 用于查看连接 2.nmcli device用于查看当前网络设备 3.nmcli connection modify用于修改当前连接配置 4.nmcli conne ...

  9. 题解 bzoj3688【折线统计】

    考虑 \(dp\) . 首先把所有节点按 \(x\) 从小到大排序是很有必要的. 记 f[i][j][0] 表示满足以第 \(i\) 个节点做折线结尾,选取的点集 \(S\) 满足 \(f(S)=j\ ...

  10. Spring Boot2 系列教程(三十二)Spring Boot 整合 Shiro

    在 Spring Boot 中做权限管理,一般来说,主流的方案是 Spring Security ,但是,仅仅从技术角度来说,也可以使用 Shiro. 今天松哥就来和大家聊聊 Spring Boot ...