如果不需要，CSS隐藏滚动条

Posted 2023-02-21

【中文标题】如果不需要，CSS隐藏滚动条

【英文标题】：CSS hide scroll bar if not needed

【发布时间】：2013-09-14 01:00:09

【问题描述】：

我想弄清楚如果不需要我如何隐藏overflow-y:scroll;。我的意思是我正在建立一个网站，并且我有一个主要区域，其中将显示帖子，如果内容不超过当前宽度，我想隐藏滚动条。

另外，我的第二个问题。我想做这样当帖子超过当前宽度时，宽度会自动增加，内容不会开箱即用。

有人知道怎么做吗？

帖子区：

.content 
    height: 600px;
    border-left: 1px solid;
    border-right: 1px solid;
    border-bottom: 1px solid;
    font-size: 15px;
    text-align: justify;
    line-height: 19px;
    overflow-y:scroll;

主网站容器：

.container 
    margin: 0 auto;
    width: 757px;
    margin-top: 30px;
    text-align: center;

【问题讨论】：

要隐藏垂直滚动条还是水平滚动条？您可以将带有 html 代码的示例发布到例如jsfiddle.net 并在此处链接

您好，我发布了我正在使用的 2 个类。在 html 上，只有调用类。

【参考方案1】：

将overflow-y 属性设置为auto，如果没有继承，则将其完全删除。

【讨论】：

我可以，但我的第二个问题也需要一些帮助，关于宽度，自动增加。

你可以随时尝试使用***搜索：***.com/questions/450903/…

你的例子中的滚动在哪里？

虽然设置 overflow-y: auto 解决了我的问题 - 该链接实际上并未显示此示例...

应该注意overflow-x: auto也可以隐藏水平滚动条。

【参考方案2】：

您可以使用overflow:auto;

您还可以使用 overflow-x 和 overflow-y 属性单独控制 x 或 y 轴。

示例：

.content overflow:auto;
.content overflow-y:auto;
.content overflow-x:auto;

【参考方案3】：

您可以同时使用 .content 和 .container 来溢出：自动。意味着如果它的文本超过自动滚动将来自 x 轴和 y 轴。 （不需要给单独的x轴和y轴通常给溢出：自动）

.content overflow:auto;

【参考方案4】：

.container overflow:auto; 可以解决问题。如果要控制特定方向，则应为该特定轴设置自动。 A.E.

.container overflow-y:auto; .container overflow-x:hidden;

上面的代码将隐藏 x 轴上的任何溢出，并在需要时在 y 轴上生成一个滚动条。但是您必须确保您的内容默认高度小于容器高度；如果没有，滚动条不会被隐藏。

【讨论】：

答案不会增加任何额外价值

【参考方案5】：

.selected-elementClass
    overflow-y:auto;

【讨论】：

答案不会增加任何额外价值

【参考方案6】：

溢出：自动；用于显示自动滚动条

【讨论】：

与***.com/a/40348064/2227743等其他答案相同

答案不会增加任何额外价值

@Akash 如果您确定答案是复制粘贴/复制/抄袭，您可以并且应该提出自定义标志。只需链接到原始答案并解释您的推理，例如“这个答案是重复的，因为它是从 xxx 年复制而来的。”