<div class="wrapper">
  <ul>
     <li>1</li>
     <li>2</li>
      <li>3</li>
  </ul>
</div>

.wrapper{
position:relative; //这个属性必须写,可以为relative或absolute。原因见js部分
margin:50px auto; //上下50px的margin, 水平居中
height:650px; //必须设定scrollbar容器的高度,只有当内容高度超过容器高度的时候,才会显示scrollbar
width:200px;
overflow:hidden; //当父容器高度不足时,只有通过滚动条才能看到超出的内容
background:#eee;
}
ul{
margin:0;
padding:0; //去掉ul默认的样式
list-style:none;
}

ul li{
border:1px solid #ccc;
height:50px;//所有的li高度加起来超过650px,即容器的高度时候,才会出现滚动条
width:100%;
}

详情:https://www.cnblogs.com/yingge/p/5737994.html

isScroll的滚动组件的用法的更多相关文章

  1. 基于vue的无缝滚动组件

    vue-seamless-scroll A simple, Seamless scrolling for Vue.js 在awesome上一直没有发现vue的无缝滚动组件,在工作之余写了个组件,分享出 ...

  2. 01day-微信小程序 表单组件 动态绑定变量 导航组件 地图组件 view text button 上下滚动组件

    04-开发者环境搭建(下载安装开发者工具) 01==>微信开发工具的下载 安装 微信小程序的工具是 下载稳定版本的 安装的时候 直接下一步就可以了 02==>项目名陈随便输入 目录 App ...

  3. Vue组件基础用法

    前面的话 组件(Component)是Vue.js最强大的功能之一.组件可以扩展HTML元素,封装可重用的代码.根据项目需求,抽象出一些组件,每个组件里包含了展现.功能和样式.每个页面,根据自己所需, ...

  4. layui(七)——rate组件常见用法总结

    layui中提供了rate组件,用法很简单,直接上代码. <div id="test1"></div> <script> layui.use(' ...

  5. viewer && ImageFlow 图片滚动组件 图片点击放大 可以滚轮放大缩小 viewer

    ImageFlow https://finnrudolph.com/products/imageflow https://github.com/countzero/ImageFlow http://w ...

  6. Flutter学习笔记(24)--SingleChildScrollView滚动组件

    如需转载,请注明出处:Flutter学习笔记(23)--多 在我们实际的项目开发中,经常会遇到页面UI内容过多,导致手机一屏展示不完的情况出现,以Android为例,在Android中遇到这类情况的做 ...

  7. iOS开发之多图片无缝滚动组件封装与使用

    经常有园友会问"博主,有没有图片无限滚动的Demo呀?", 正儿八经的图片滚动的Demo我这儿还真没有,今天呢就封装一个可以在项目中直接使用的图片轮播.没看过其他iOS图片无限轮播 ...

  8. vue 自定义marquee无缝滚动组件

    先上效果图: (1) 看起来可能有点卡顿,但是实际上页面上看起来挺顺畅的. (2) 思路就是获取每一个列表的宽度,设置定时器移动列表,当移动的距离达到一个列表的宽度的时候,把这个距离放到数组的最后.这 ...

  9. layui(三)——laypage组件常见用法总结

    laypage 的使用非常简单,指向一个用于存放分页的容器,通过服务端得到一些初始值,即可完成分页渲染.核心方法: laypage.render(options)  来设置基础参数. 一.laypag ...

随机推荐

  1. 《计算机图形学》2.1.1 刷新式CRT

    图形系统一般使用显示器作为其输出设备. 大部分视频监视器的操作是基于标准的阴极射线管(cathode-ray tube,CRT)设计的,但是也已经出现了其他一些技术,并且固态监视器终究要占据主导地位. ...

  2. Esper学习之九:EPL语法(五)

    本篇的内容主要包括了Subquery(也就是子查询)和Join,内容不少,但是不难,基本上和sql差不太多. 1.Subquery EPL里的Subquery和sql的类似,是否比sql的用法更多我不 ...

  3. 六、K3 WISE 开发插件《直接SQL报表开发新手指导 - BOM成本报表》

    ======================== 目录: 1.直接SQL报表 ======================== 1.直接SQL报表 以BOM成本报表为例,在销售模块部署,需要购买[金蝶 ...

  4. 【分享】IT产业中的三大定理(三) —— 反摩尔定理 (Reverse Moore's Law)

    Google(谷歌)的 CEO 埃里克·施密特在一次采访中指出,如果你反过来看摩尔定理,一个 IT 公司如果今天和十八个月前卖掉同样多的.同样的产品,它的营业额就要降一半.IT 界把它称为反摩尔定理. ...

  5. [原]openstack-kilo--issue(二) openstack auth error

    /** 系统环境:redhat7.2 repo:163 openstack version : kilo author: lihaibo 本博客已经添加"打赏"功能,"打 ...

  6. ELK系列四:Logstash的在ELK架构中的使用和简单的输入

    1.ELK架构中Logstash的位置: 1.1.小规模集群部署(学习者适用的架构) 简单的只有Logstash.Elasticsearch.Kibana,由Logstash收集日志或者流量信息,过滤 ...

  7. Windows Server 2012升级R2过程中意外关闭恢复原系统方法

    2012升级R2过程中强制关闭了计算机,导致再次启动后蓝屏提示"BAD_SYSTEM_CONFIG_INFO".用2012安装盘进入尝试修复失败(安全模式什么的都不用想),进入命令 ...

  8. 从Java代码到字节码(1)

    理解Java代码是如何被编译为字节码并在Java虚拟机(JVM)上执行是非常重要的,这将帮助理解你的程序是如何执行的.这样的理解不仅仅能够让你在逻辑上更好的掌握语言特性,而且能够有机会理解在做出重要决 ...

  9. android极光杀掉程序收不到通知

    http://docs.jpush.io/guideline/faq/#android 第三方系统收不到推送的消息 由于第三方 ROM 的管理软件需要用户手动操作 小米[MIUI] 自启动管理:需要把 ...

  10. jenkins之另辟蹊径实现根据svn项目实现智能选择

    项目要求,根据svn选择的trunk或branches及tags里的各分支,动态选择参数.一开始认为很简单,直接用jenkins中的List Subversion tags插件及active choi ...