移动端 实现ul横向滚动条
ul {
display: flex;
width: 100%;
height: 3.333333rem;
background: #fff;
padding: 0.373333rem 0.32rem 0;
box-sizing: border-box;
/* 下面是实现横向滚动的关键代码 */
display: inline;
float: left;
white-space: nowrap;
overflow-x: scroll;
-webkit-overflow-scrolling: touch; /*解决在ios滑动不顺畅问题*/
overflow-y: hidden;
}
ul li {
display: inline-block; /*设置li为行内块级元素*/
width: 3.6rem;
height: 2.24rem;
text-align: left;
border-radius: 6px 6px 6px 6px;
margin-right: 0.373333rem;
}
隐藏滚动条
ul::-webkit-scrollbar {
display: none;
}
移动端 实现ul横向滚动条的更多相关文章
- 移动端添加横向滚动条&隐藏
添加横向滚动条ul { display: flex; overflow-x: auto; overflow-y: hidden; white-space: nowrap; }隐藏滚动条,保留滚动效果 ...
- 解决移动端浏览器页面 X轴横向滚动条问题
写web端页面的时候,总是会出现横向滚动条,即 X 轴滚动条,导致页面左右滑来滑去. 即使设置了 body,html {overflow-x:hidden;width:100%;} 也无法生效. 解决 ...
- DataGrid横向滚动条无法拖动的问题
项目中经常遇到一些问题,这些问题可能很简单,但是之前从未遇到,可能经过了一番谷歌,也可能是查阅了MSDN,或是借鉴了大牛博客,逐渐有了些眉目,为了将这些东西落地,也为了将来之不易的东西记录下来,以备今 ...
- sub,dl,dt,排版,横向滚动条,浮动元素居中,box-sizing
1.sub标签 下标 2.dl,dt,dd用的地方通常是具有标题,而标题下对应有若干列表简单的(栏目标题+对应标题列表)和标题对应下面有内容.在使用时候我们能简洁html代码情况下,学会灵活使用dl ...
- android 横向滚动条
/*** * 横向滚动条,修改版,从左向右滚动,支持html代码和html里面的网络图片 */public class MarqueeView extends LinearLayout { priva ...
- WPF,解决Listbox,按住ListboxItem向下拖出Listbox,横向滚动条跑到最后。
类似这种样式的控件,.,在横向滚动条隐藏的情况下有这样的问题.(横向滚动条显示的时候也会,,目前不知道怎么解决.) 因为这个控件偏移是利用ListBox的ItemsPanelTemplate模版里的S ...
- jquery横向滚动条
此代码献给wendy 由于工作太忙,下次再整理成插件调用,先记录下来,欢迎同学们提意见. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Tr ...
- 逆天的IE7中,诡异的横向滚动条
今天老邹我又要吐槽IE7了,这个奇葩浏览器总是不让省心.这回遇到的问题,灰常难发现是怎么回事,不过还是让我发现原因,哈哈,只要原因去干掉这个问题比躲避问题用别的办法绕开要爽的多啊. 首先我还是介绍下, ...
- 发掘ListBox的潜力(一):自动调整横向滚动条宽度
<自绘ListBox的两种效果>一文帖出之后,从反馈信息来看,大家对这种小技巧还是很认同.接下来我将继续围绕ListBox写一系列的文章,进一步发掘ListBox的潜力,其中包括:自动调整 ...
随机推荐
- Jbpm4.4+hibernate3.5.4+spring3.0.4+struts2.1.8 整合例子
转自:http://www.blogjava.net/wangxinsh55/archive/2011/07/24/354925.html Jbpm4.4+hibernate3.5.4+sprin ...
- 【Linux】目录文件权限的查看和修改【转】
转载自:http://zhaoyuqiang.blog.51cto.com/6328846/1214718 ============================================== ...
- Java中读取.properties配置文件的通用类
由于Java中读取配置文件的代码比较固定,所以可以将读取配置文件的那部分功能单独作为一个类,以后可以复用.为了能够达到复用的目的,不能由配置文件中每一个属性生成一个函数去读取,我们需要一种通用的方法读 ...
- js获取年月日时分秒星期
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- Android 6.0以上 需要运行时申请的权限
转载:http://www.cnblogs.com/tangs/articles/6377347.html 自从Android6.0发布以来,在权限上做出了很大的变动,不再是之前的只要在manifes ...
- (最短路 spfa)Wormholes -- poj -- 3259
http://poj.org/problem?id=3259 Wormholes Time Limit: 2000MS Memory Limit: 65536K Total Submissions ...
- Codeforces807 C. Success Rate 2017-05-08 23:27 91人阅读 评论(0) 收藏
C. Success Rate time limit per test 2 seconds memory limit per test 256 megabytes input standard inp ...
- sine
- 取得 APP 自己的版本号 (跨 4 个平台)
http://www.cnblogs.com/onechen/p/3627942.html XE7 源码下载:[原创]取得APP自己的版本号(狠跨4个平台)XE7.zip XE6 源码下载:[原创]取 ...
- SHT20 IIC 寄存器概述
** 注:部分内容来自SHT20芯片手册翻译 ** 1.寄存器列表 名称 指令(bin) 寄存器内容(hex) 主机模式(Trigger T measurement hold master) 1110 ...