css 隐藏滚动条
如何使用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 隐藏滚动条的更多相关文章
- 实现CSS隐藏滚动条并可以滚动内容
隐藏滚动条的同时还需要支持滚动,我们经常在前端开发中遇到这种情况,最容易想到的是加一个iscroll插件,但其实现在CSS也可以实现这个功能,我已经在很多地方使用了,下面一起看看这三种方法. 方法1: ...
- css隐藏滚动条
xhtml中隐藏滚动条在用ie6浏览有框架的xhtml页面的时候,默认会水平和垂直滚动条会一起出现,这是ie6的一个bug,在firefox上是正常的,出现的原因是其对XHTML 1.0 transi ...
- 3种方法实现CSS隐藏滚动条并可以滚动内容
隐藏滚动条的同时还需要支持滚动,我们经常在前端开发中遇到这种情况,最容易想到的是加一个iscroll插件,但其 实现在CSS也可以实现这个功能,我已经在很多地方使用了,下面一起看看这三种方法. 方法1 ...
- 如何让css隐藏滚动条 兼容谷歌、火狐、IE等各个浏览器
项目中,页面效果需要展示一个页面的移动端效果,使用的是一个苹果手机样式背景图,咋也没用过苹果,咋也不敢形容. 如下图所示: 在谷歌浏览器如图一滚动条顺利隐藏,但是火狐就如图二了,有了滚动条丑的一批. ...
- css隐藏滚动条 兼容谷歌、火狐、IE等各个浏览器
项目中,页面效果需要展示一个页面的移动端效果,使用的是一个苹果手机样式背景图,咋也没用过苹果,咋也不敢形容. 如下图所示: 在谷歌浏览器如图一滚动条顺利隐藏,但是火狐就如图二了,有了滚动条丑的一批. ...
- 如何使用CSS隐藏滚动条并且兼容大部分浏览器
隐藏滚动条,已经自己实测在浏览器Chrome, IE (6+), Firefox, Opera, Safari. 如下demo: Content 1 Content 1 Content 1 Conte ...
- 浏览器css隐藏滚动条的方法!除了IE一般都支持
::-webkit-scrollbar { /* 滚动条整体部分 */ width:0px; margin-right:2px}::-webkit-scrollbar-track-piece { /* ...
- css隐藏滚动条依旧可以滚动
在做企业页面的时候,大部分页面都应该是活的,不应该写死,因为要从后台拿数据进行填充.而后台的数据是不确定的,有时候会让我们的容器撑得很大.这时候我们需要隐藏掉滚动条达到美观或者其他布局效果,隐藏掉单个 ...
- CSS隐藏滚动条但又能滚动,不用js实现
隐藏多余的内容,但是可以滑动查看 原理就在于padding-right:17px;把滚动条挤出去隐藏了
随机推荐
- 【WPF学习】第二十三章 列表控件
WPF提供了许多封装项的集合的控件,本章介绍简单的ListBox和ComboBox控件,后续哈会介绍更特殊的控件,如ListView.TreeView和ToolBar控件.所有这些控件都继承自Item ...
- Cassandra2.2.10安装过程
1. 2.安装JVM 3.OS环境配置: 关闭防火墙:service iptables stop vi /etc/sysctl.conf vm.zone_reclaim_mode=0 vm.max_m ...
- ubuntu19配置静态IP并开启SSH远程登陆
前言 从ubuntu从17.10开始,已经不再在/etc/network/interfaces里配置IP,即使配置了也不会生效,而是改成netplan方式 ,配置写在/etc/netplan/文件夹 ...
- VS2017/19 在更新之后,.net core项目出一个500的神奇错误
先说症状: VS 更新升级之后,如果用的是 .net core 的项目的时候,当vs升级时,.net core的sdk或者runtime有跟着升级的话,项目发布之后,覆盖dll到服务器时,会出现这个错 ...
- Spring基于注解配置AOP
D:\Java\IdeaProjects\JavaProj\SpringHelloWorld\src\aop.xml <?xml version="1.0" encoding ...
- supervisor管理tomcat
操作目的:用supervisor工具管理tomcat服务 配置环境,安装服务,以及多实例 脚本编辑: 前提 机器的opt目录下必须有jdk-8u131-linux-x64_.rpm 以及apache- ...
- Magicodes.IE在Docker中使用
Magicodes.IE在Docker中使用 更新日志 2019.02.13 [Nuget]版本更新到2.0.2 [导入]修复单列导入的Bug,单元测试"OneColumnImporter_ ...
- ARTS Week 12
Jan 13, 2020 ~ Jan 19, 2020 Algorithm Problem 112. Path Sum (路径总和) 题目链接 题目描述:给定一棵二叉树和一个值 sum ,检查二叉树是 ...
- c++ 中数组的引用
在C++里,数组也是可以引用的. 代码如下: char str1[] = "abcde"; ] = str1; 解读第二句代码,括号的优先级最高,'str2'首先与'&'相 ...
- C++用rand()和srand()生成随机数
内容来自<编程实战宝典> 首先来看函数原型 int rand(void); void srand(unsigned int seed); 1.rand()函数不需要任何参数,直接返回一个随 ...