如何向我的HTML添加滚动条，如果内容小于限制，则会消失

Question

我正在尝试创建一个具有可扩展小部件的表单。问题是当窗口小部件打开时，窗体超出了内容框中的限制，看起来很糟糕。

我尝试使用 overflow：scroll 但它创建了2个丑陋的滚动条，即使conent小于内容框也不会消失。我只需要一个垂直滚动条。

Visual Studio还警告说，CSS中没有溢出y。

Answer 1

将溢出更改为 auto 并定义元素的高度和/或宽度。

Answer 2

overflow-x 和 overflow-y 是CSS3提案的一部分，适用于四大浏览器的所有当前版本。

我通常会这样做：

overflow: auto;
overflow-x: auto;
overflow-y: auto;

原因是，一旦内容在一个方向溢出，浏览器有时会将 overflow：auto 视为 overflow：scroll （两个丑陋的滚动条），但这些浏览器已经支持优先获得 overflow-x 和 overflow-y 。

Answer 3

Swilliams对如何治疗这种症状给出了一个很好的答案。但是，您可能也想要考虑根本原因 - 如果内容框没有被限制为固定大小，它可以收缩和/或扩展以适合任何大小的形式，没有滚动条。网页在设计上是灵活的，并且试图“修复”网页。这种灵活性通常最终会遇到这类问题。