如何停止水平滚动？

Question

我用html和javascript编写了一个文件。

在那里垂直滚动应该在那里，但我想停止水平滚动。

我怎样才能做到这一点？

Answer 1

Sarfraz 已经提到过 overflow-x ，这是一个答案，虽然它意味着（正如它所说的那样！）任何本来不对的东西现在对用户来说都是不可用的。 有用例，但主要是不希望有用户无法访问的内容。

问题是：你为什么要进行水平滚动？ 在正常情况下，浏览器将包装内容，使得不需要任何水平滚动。 如果用户具有正常窗口大小，则通过将指定为特定宽度的元素（通过样式信息或具有不可包装的内容（如大图像））导致设计中的水平滚动。 例如，这不需要水平滚动：

<p>...lots of text here...</p>

......但这会：

<p style='width: 1200px'>...lots of text here...</p>

...如果用户的浏览器窗口宽度小于1200像素。

因此，如果将内容移至右侧不可用不是您想要的 ，我的答案是找到导致滚动的元素并更正它们。

Answer 2

将以下样式应用于该元素：

overflow-x:hidden;

或它应该是：

overflow:auto;
overflow-x:hidden;

这将确保在需要时垂直滚动。

Answer 3

如果我正确理解您的问题，您希望防止您的内容超出浏览器窗口的范围。 通常，设计人员将其布局宽度设置为960px，以便在页面中心设置固定宽度，这非常适合1024px x 768px计算机屏幕。 根据以下评论，较小分辨率的计算机会因此获得滚动条。 你可以这样做：

<html>
<head>
</head>
<body>
  <div style="width:960px; margin:0 auto;">
     ... The rest of your content goes here ...
  </div>
</body>
</html>

您可以在此处详细了解浏览器宽度：

如果您发现内容超出此宽度，则页面内的特定项目太宽。 自己查看页面以确定它可能是什么，或者为我们的帮助提供堆栈溢出的链接。 举个例子，在上面的div之间有这个问题会有问题：

<table style="width:99999px;"> ... table stuff ... </table>

Answer 4

如果你想在每个浏览器中使用它，你不应该为元素添加任何宽度，然后在每个浏览器中都不会出现水平溢出。

Answer 5

如果你想要你的html.body或div液体;

div.sample{ width:100%;}

样本div将调整大小，无论您的屏幕是大还是小/没有滚动/

Answer 6

如果使用浏览器查看文件，则可以通过将内容设置为百分比来设置内容的宽度。