使用CSS溢出属性：

.noscroll {
  width: 150px;
  height: 150px;
  overflow: auto; /* Or hidden, or visible */
}

以下是更多示例：

溢出-x，溢出-y测试CSS溢出属性

如果您希望滚动工作，在隐藏滚动条之前，请考虑设置样式他们现代版本的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中，页面是屏蔽内容的大小，也可以滚动！滚动与页面缩放进行可接受的交互。

我只是想告诉其他读到这个问题的人，在body元素上设置overflow：hidden（或overflow-y）并没有为我隐藏滚动条。

我不得不使用html元素。

要禁用垂直滚动条，只需添加overflow-y:hidden；。

了解更多信息：溢出。

您可以使用隐藏溢出的包装器div，并将内部div设置为auto来实现这一点。

要删除内部div的滚动条，可以通过对内部div应用负边距将其从外部div的视口中拉出。然后对内部div使用相等的填充，以使内容保持在视图中。

JSFiddle公司

###HTML格式

<div class="hide-scroll">
    <div class="viewport">
        ...
    </div>
</div>

###CSS格式

.hide-scroll {
    overflow: hidden;
}

.viewport {
    overflow: auto;

    /* Make sure the inner div is not larger than the container
     * so that we have room to scroll.
     */
    max-height: 100%;

    /* Pick an arbitrary margin/padding that should be bigger
     * than the max scrollbar width across the devices that 
     * you are supporting.
     * padding = -margin
     */
    margin-right: -100px;
    padding-right: 100px;
}

设置溢出：隐藏；在body标签上，如下所示：

<style type="text/css">
    body {
        overflow: hidden;
    }
</style>

上面的代码“隐藏”了水平和垂直滚动条。

如果要仅隐藏垂直滚动条，请使用overflow-y：

<style type="text/css">
    body {
        overflow-y: hidden;
    }
</style>

如果您只想隐藏水平滚动条，请使用overflow-x：

<style type="text/css">
    body {
        overflow-x: hidden;
    }
</style>

如果需要，内容将被剪裁以适合填充框。不提供滚动条，也不允许用户滚动（例如通过拖动或使用滚轮）。内容可以通过编程方式滚动（例如，通过设置属性值，如offsetLeft），因此元素仍然是滚动容器。（来源）