如果您正在寻找隐藏移动设备滚动条的解决方案，请遵循Peter的答案！

这里有一个jsfiddle，它使用下面的解决方案隐藏水平滚动条。

.scroll-wrapper{
    overflow-x: scroll;
}
.scroll-wrapper::-webkit-scrollbar { 
    display: none; 
}

它在搭载Android 4.0.4的三星平板电脑（冰淇淋三明治，在本机浏览器和Chrome浏览器中）和搭载iOS 6的iPad（在Safari和Chrome浏览器）上进行了测试。

我编写了一个WebKit版本，其中包含一些选项，如自动隐藏、小版本、仅滚动-y或仅滚动-x：

._scrollable{
    @size: 15px;
    @little_version_ratio: 2;
    @scrollbar-bg-color: rgba(0,0,0,0.15);
    @scrollbar-handler-color: rgba(0,0,0,0.15);
    @scrollbar-handler-color-hover: rgba(0,0,0,0.3);
    @scrollbar-coner-color: rgba(0,0,0,0);

    overflow-y: scroll;
    overflow-x: scroll;
    -webkit-overflow-scrolling: touch;
    width: 100%;
    height: 100%;

    &::-webkit-scrollbar {
        background: none;
        width: @size;
        height: @size;
    }

    &::-webkit-scrollbar-track {
        background-color:@scrollbar-bg-color;
        border-radius: @size;
    }

    &::-webkit-scrollbar-thumb {
        border-radius: @size;
        background-color:@scrollbar-handler-color;
        &:hover{
            background-color:@scrollbar-handler-color-hover;
        }
    }

    &::-webkit-scrollbar-corner {
      background-color: @scrollbar-coner-color;
    }

    &.little{
        &::-webkit-scrollbar {
            background: none;
            width: @size / @little_version_ratio;
            height: @size / @little_version_ratio;
        }
        &::-webkit-scrollbar-track {
            border-radius: @size / @little_version_ratio;
        }
        &::-webkit-scrollbar-thumb {
            border-radius: @size / @little_version_ratio;
        }
    }

    &.autoHideScrollbar{
        overflow-x: hidden;
        overflow-y: hidden;
        &:hover{
            overflow-y: scroll;
            overflow-x: scroll;
            -webkit-overflow-scrolling: touch;
            &.only-y{
                overflow-y: scroll !important;
                overflow-x: hidden !important;
            }

            &.only-x{
                overflow-x: scroll !important;
                overflow-y: hidden !important;
            }
        }
    }

    &.only-y:not(.autoHideScrollbar){
        overflow-y: scroll !important;
        overflow-x: hidden !important;
    }

    &.only-x:not(.autoHideScrollbar){
        overflow-x: scroll !important;
        overflow-y: hidden !important;
    }
}

http://codepen.io/hicTech/pen/KmKrjb

我的HTML是这样的：

<div class="container">
  <div class="content">
  </div>
</div>

将其添加到要隐藏滚动条的div中：

.content {
  position: absolute;
  right: -100px;
  overflow-y: auto;
  overflow-x: hidden;
  height: 75%; /* This can be any value of your choice */
}

并将其添加到容器中

.container {
  overflow-x: hidden;
  max-height: 100%;
  max-width: 100%;
}

如果您希望滚动工作，在隐藏滚动条之前，请考虑设置样式他们现代版本的OS X和移动操作系统具有滚动条，而不适合用鼠标抓取，非常漂亮和中性。

为了隐藏滚动条，约翰·库尔拉克（John Kurlak）的一项技术很好，除了离开没有触摸板无法滚动的Firefox用户，除非他们有一只带轮子的老鼠，他们可能会这样做，但即使这样，他们通常也可以仅垂直滚动。

John的技术使用三个元素：

屏蔽滚动条的外部元素。具有滚动条的中间元素。以及一个内容元素，既可以设置中间元素的大小它有滚动条。

必须可以将外部元素和内容元素的大小设置为相同这消除了使用百分比，但我想不出其他什么用正确的调整是行不通的。

我最担心的是是否所有版本的浏览器都设置了滚动条可见溢出内容可见。我已经在当前浏览器中进行了测试，但是而不是更老的。

请原谅我的SASS；P

%size {
    // set width and height
}

.outer {
    // mask scrollbars of child
    overflow: hidden;
    // set mask size
    @extend %size;
    // has absolutely positioned child
    position: relative;
}

.middle {
    // always have scrollbars.
    // don't use auto, it leaves vertical scrollbar showing
    overflow: scroll;
    // without absolute, the vertical scrollbar shows
    position: absolute;
}
// prevent text selection from revealing scrollbar, which it only does on
// some webkit based browsers.
.middle::-webkit-scrollbar {
    display: none;
}

.content {
    // push scrollbars behind mask
    @extend %size;
}

测试

OS X为10.6.8。Windows是Windows 7。

Firefox 32.0隐藏滚动条。箭头键不会滚动，即使在单击聚焦后，但鼠标滚轮和触摸板上的两个手指可以操作OS X和Windows。铬37.0隐藏滚动条。单击以聚焦后，箭头键起作用。鼠标滚轮和轨迹板工作。OS X和Windows。Internet Explorer 11隐藏滚动条。单击以聚焦后，箭头键起作用。鼠标滚轮作品窗户。Safari 5.1.10隐藏滚动条。单击以聚焦后，箭头键起作用。鼠标滚轮和轨迹板工作。操作系统X。Android 4.4.4和4.1.2。隐藏滚动条。触摸滚动工作。在Chrome 37.0、Firefox中试用32.0和4.4.4上的HTMLViewer（无论是什么）。在HTMLViewer中，页面是屏蔽内容的大小，也可以滚动！滚动与页面缩放进行可接受的交互。

即使溢出，我的答案也会滚动：隐藏；，使用jQuery：

例如，使用鼠标滚轮水平滚动：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type='text/javascript' src='/js/jquery.mousewheel.min.js'></script>
<script type="text/javascript">
    $(function() {

       $("YourSelector").mousewheel(function(event, delta) {

          this.scrollLeft -= (delta * 30);
          event.preventDefault();
       });
    });
</script>

除了彼得的回答：

#element::-webkit-scrollbar {
    display: none;
}

这对Internet Explorer 10的作用相同：

 #element {
      -ms-overflow-style: none;
 }