好吧，上面的答案已经很好地解释了一半的问题。为了另一半。

为什么不直接隐藏滚动条本身呢? 这样看起来更吸引人，因为大多数人(包括我)都讨厌滚动条。 您可以使用此代码

::-webkit-scrollbar {
    width: 0px;  /* Remove scrollbar space */
    background: transparent;  /* Optional: just make scrollbar invisible */
}

您可以使用这段代码。

<div id="" style="overflow-y:scroll; overflow-x:hidden; height:400px;">

overflow-x: The overflow-x property specifies what to do with the left/right edges of the content - if it overflows the element's content area. overflow-y: The overflow-y property specifies what to do with the top/bottom edges of the content - if it overflows the element's content area. Values visible: Default value. The content is not clipped, and it may be rendered outside the content box. hidden: The content is clipped - and no scrolling mechanism is provided. scroll: The content is clipped and a scrolling mechanism is provided. auto: Should cause a scrolling mechanism to be provided for overflowing boxes. initial: Sets this property to its default value. inherit Inherits this property from its parent element.

除了使用错误的属性外，你已经把它覆盖住了。滚动条可以被任意属性overflow、overflow-x或overflow-y触发，并且每个属性都可以被设置为可见、隐藏、滚动、自动或继承中的任意一种。你现在看到的是这两个:

auto -该值将查看框的宽度和高度。如果它们被定义了，它就不会让盒子扩展超过这些边界。相反(如果内容超过了这些边界)，它将为超过其长度的任何一个边界(或两个边界)创建滚动条。 scroll -该值强制滚动条，无论如何，即使内容没有超出边界设置。如果内容不需要滚动，该工具条将显示为“禁用”或非交互式。

如果你总是希望垂直滚动条出现:

你应该使用overflow-y: scroll。这将强制为垂直轴显示滚动条，无论是否需要。如果不能滚动上下文，它将显示为“禁用”滚动条。

如果你只希望滚动框出现滚动条:

只需使用overflow: auto即可。因为在默认情况下，当您的内容无法在当前行中放置时，它会切换到下一行，因此不会创建水平滚动条(除非它位于禁用了换行功能的元素上)。对于垂直栏，它将允许内容扩展到您所指定的高度。如果它超过了这个高度，它将显示一个垂直滚动条来查看其余的内容，但如果它没有超过这个高度，它将不显示滚动条。

使用overflow-y: auto;在div上。

此外，您还应该设置宽度。

好吧，上面的答案已经很好地解释了一半的问题。为了另一半。

为什么不直接隐藏滚动条本身呢? 这样看起来更吸引人，因为大多数人(包括我)都讨厌滚动条。 您可以使用此代码

::-webkit-scrollbar {
    width: 0px;  /* Remove scrollbar space */
    background: transparent;  /* Optional: just make scrollbar invisible */
}

我在代码中添加了一些注释用于解释。这里有一些参考:https://www.w3schools.com/css/css_overflow.asp

div { overflow-y: auto; /* the auto value is similar to scroll, but it adds scrollbars only when necessary */ word-break: keep-all; /* this is optional, so the words keep in one line */ white-space: nowrap; /* this is optional, so the div can expands to the side */ } <div> Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum. </div>