这篇文章主要介绍“CSS3中webkit-overflow-scolling怎么使用”，在日常操作中，相信很多人在CSS3中webkit-overflow-scolling怎么使用问题上存在疑惑，小编查阅了各式资料，整理出简单好用的操作方法，希望对大家解答”CSS3中webkit-overflow-scolling怎么使用”的疑惑有所帮助！接下来，请跟着小编一起来学习吧！
我们都知道在ios的safari浏览器和app内核浏览器中，当一个h6页面内容超出屏幕高度，我们手指去滑动屏幕的时候，只要手势一离开屏幕，滚动立刻结束。免费云主机域名这时候我们可以通过设置-webkit-overflow-scrolling=touch来使页面可以顺畅滚动，但是设置这个也会引出许多问题。
1、单独对body设置-webkit-overflow-scrollingtouch是无效的，需要针对html和body同时设置才有效果，代码如下：
html,body{
height:100%;
overflow:auto;
-webkit-overflow-scrolling:touch;
}
2、父容器设置-webkit-overflow-scrolling=touch后，子容器不允许出现fixed固定的子元素，为什么这么说呢。因为当你设定-webkit-overflow-scrolling=touch后，你滑动屏幕的时候会发现fixed属性失效了，他也跟着屏幕滚动了，只有当滚动停止的时候这个元素才会在固定到页面上。显然这不是我们要的结果。
这里我的解决方法是不把-webkit-overflow-scrolling设置在body元素上，在需要滚动的地方另外增加div容器去设定，然后把需要fixed的容器都直接放在body元素内。
3、单独对div设定-webkit-overflow-scrolling属性无效，经测试后发现，我需要先对父容器div1设定为有高度的容器，然后在对超出的子容器设定-webkit-overflow-scrolling属性具体代码如下：
.div-c{width:100%;height:2000px;overflow:auto;/*测试发现一定要设定这个值才起作用*/-webkit-overflow-scrolling:touch;}
这篇文章主要介绍了微信小程序怎么实现在地图上多地点标识的相关知识，内容详细易懂，操作简单快捷，具有一定借鉴价值，相信大家阅读完这篇微信小程序怎么实现在地图上多地点标识文章都会有所收获，下面我们一起来看看吧。以下是具体做法： wxml js hospitalDa…
免责声明：本站发布的图片视频文字，以转载和分享为主，文章观点不代表本站立场，本站不承担相关法律责任；如果涉及侵权请联系邮箱：360163164@qq.com举报，并提供相关证据，经查实将立刻删除涉嫌侵权内容。
微信扫一扫 
