.scroll-list ul{

    white-space: nowrap;

    -webkit-overflow-scrolling: touch;

    overflow-x: auto;

    overflow-y: hidden;

    padding: 0 0.1rem;

    margin-bottom: -.2rem;

    overflow: -moz-scrollbars-none;

    overflow: -moz-scrollbars-none;

}

.scroll-list ul::-webkit-scrollbar{

    display: none;

}

设置横向滚动时，可以设置overflow-x：auto;

overflow实现隐藏滚动条同时又可以滚动的更多相关文章

  1. CSS 实现隐藏滚动条同时又可以滚动（转）

    CSS 实现隐藏滚动条同时又可以滚动 移动端页面为了更接近原生的体验,是否可以隐藏滚动条,同时又保证页面可以滚动? 使用 overflow:hidden 隐藏滚动条,但存在的问题是:页面或元素失去了滚 ...

  2. 纯css实现移动端横向滑动列表&&overflow:atuo;隐藏滚动条

    <!DOCTYPE html> <html> <head> <title>横向滑动</title> <style type=" ...

  3. 前端切图:CSS实现隐藏滚动条同时又可以滚动

    CSS 实现隐藏滚动条同时又可以滚动 原始功能: 图片发自简书App 添加伪类之后的功能: 图片发自简书App 完整demo如下: <!DOCTYPE html> <html> ...

  4. css设置Overflow实现隐藏滚动条的同时又可以滚动

    .scroll-list ul{ white-space: nowrap; -webkit-overflow-scrolling: touch; overflow-x: auto; overflow- ...

  5. CSS 实现隐藏滚动条同时又可以滚动

    方法1: 利用 css 3 的新特性  -webkit-scrollbar, 但是这种方式只兼容chrome,不兼容 火狐 和 IE. /* for Chrome */ .content::-webk ...

  6. 纯css，div隐藏滚动条，保留鼠标滚动效果。

    示例1: html,body { height: 100%; } body { overflow: hidden; } .full-screen { position: relative; width ...

  7. CSS隐藏滚动条但又能滚动，不用js实现

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

  8. CSS — 隐藏滚动条，依旧可以滚动

    公司的系统,在PC端可以管理我们的公众号,在发布模块页面时有一个预览功能,呈现页面在手机端的样式. 做法很简单,一会就完成了,但是在预览内容过长时手机外框会有一个滚动条,影响美观,于是就想把它去掉,有 ...

  9. css隐藏滚动条、移动端滚动卡顿的解决

    1.如果想保持容器能够滚动,同时不想看到丑陋的滚动条,chrome.firefox和移动端上不考虑兼容性直接 element::-webkit-scrollbar{ display:none } 2. ...

随机推荐

  1. ios计算字符串宽高,指定字符串变色,获取URL参数集合

    #import <Foundation/Foundation.h> @interface NSString (Extension) - (CGFloat)heightWithLimitWi ...

  2. java.lang.RuntimeException: JPedal Trial has now expired

    具体提示: java.lang.RuntimeException: JPedal Trial has now expired jpedal-server-trial.jar jar包过期了,jpeda ...

  3. JS中的apply、call、bind区别

    apply.call.bind 用法 1:作用 改变函数运行时的上下文,即改变this的指向问题. xxxFunction.call(this,arg1,arg2,arg3); xxxFunction ...

  4. 在 IIS 中承载 WCF 服务

    本主题概述了创建 Internet 信息服务 (IIS) 中承载的 Windows Communication Foundation (WCF) 服务所需的基本步骤. 本主题假设您熟悉 IIS 且了解 ...

  5. pycharm内存不足时如何修改设置？

    Help->Find Action->(type "VM Options")->(Click)"Edit Custom VM Options" ...

  6. NSA开发的工控ICS/SCADA态势感知开源工具Grassmarlin（附下载地址）

    工具简介 GRASSMARLIN是一款由美国国家安全局开发的,能够帮助运维工程师在IP网络上发现并编目监控和数据采集系统(SCADA)和工业控制系统(ICS)主机的开源软件工具,也被称为被动网络映射器 ...

  7. PS如何绘制虚线圆

    1 绘制一个圆的路径   2 选择铅笔工具,然后点击"画笔笔尖形状",选好笔尖的直径和间距(不同的直径对应不同的间距,没有标准数值,自己推拉滑动条就可以了)   3 在路径选项卡, ...

  8. 机器学习笔记——SVM

    SVM(Support Vector Machine).中文名为 支持向量机.就像自己主动机一样.听起来异常神气.最初总是纠结于不是机器怎么能叫"机",后来才知道事实上此处的&qu ...

  9. UNION（并集）集合运算

    在集合论中,两个集合(记为集合A和B)的并集是一个包含集合A和B中所有元素的集合.换句话说,如果一个元素属于任何一个输入集合,那么它也属于结果集. 在T-SQL中,UNION 集合运算可以将两个输入查 ...

  10. 玩转单元測试之DBUnit

    本文同一时候发表在:http://www.cnblogs.com/wade-xu/p/4547381.html DBunit 是一种扩展于JUnit的数据库驱动測试框架,它使数据库在測试过程之间处于一 ...