问题描述：
已经设置： .selector::-webkit-scrollbar { display: none }
在浏览器上面横向滚动条已经消除，安卓上面也消失了，但是ios上面仍然有
解决办法：
原理：ios无法直接让滚动条隐藏::-webkit-scrollbar {display: none;}是没有用的，所以我的思路就是让滚动条离远点超出父元素的范围，在通过隐藏父元素的超出部分让滚动条消失。由于子元素的高度大于父元素的高度，超过父元素的高度的内容被剪裁。因此，子元素的滚动条就被剪裁掉了
代码实现：
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>Document</title></head><style>body {width: 100%;overflow: hidden;}* {margin: 0;padding: 0;}.con {position: relative;width: 100%;/*height: 200px;*/ /*为了处理safari出现的滚动条*/overflow: hidden;/*把处理到元素外面的滚动条隐藏*/}.aa {/*height: 205px;*/ /*为了处理safari出现的滚动条*/position: relative;overflow-x: auto;-webkit-overflow-scrolling: touch;/*这个属性可以使滚动更流畅有左右弹动*/margin-top: -.3rem;padding-bottom: .3rem;-webkit-transform: translateY(0.3rem) !important;transform: translateY(0.3rem);}.bb {width: 1890px;}.bb span {display: inline-block;width: 200px;height: 200px;background: #ccc;margin-right: 10px;float: left;}</style><body><!-- 最少要有三层，在第三层放滚动的元素 --><div class="con"><!-- 第一层必须要 有overflow: hidden--><div class="aa"><!-- 第二层 处理盒子位置 进而把滚动条处理到元素下面（外面）以便隐藏滚动条--><div class="bb"><!-- 第三层写具体的宽度--><span>1</span><span>2</span><span>3</span><span>4</span><span>4</span><span>6</span><span>7</span><span>8</span><span>9</span></div></div></div></body></html>
