如何停止水平滚动？
[英]How to stop horizontal scrolling?
问题描述
I have written a file using html and javascript. 
我用html和javascript编写了一个文件。
In that Vertical scrolling should be there, but i want to stop horizontal scrolling. 在那里垂直滚动应该在那里，但我想停止水平滚动。
How can I do that? 我怎样才能做到这一点？
6 个解决方案
解决方案1
8 已采纳 2010-06-07 05:57:03
Sarfraz has already mentioned overflow-x , which is one answer although it means (as it says!) that anything that would have been off to the right is now unavailable to the user. Sarfraz 已经提到过 overflow-x ，这是一个答案，虽然它意味着（正如它所说的那样！）任何本来不对的东西现在对用户来说都是不可用的。 There are use cases for that, but in the main it's undesireable to bother to have content the user can't access. 有用例，但主要是不希望有用户无法访问的内容。
The question is: Why are you getting horizontal scrolling at all? 问题是：你为什么要进行水平滚动？ In the normal course of things, the browser will wrap content such that there isn't any horizontal scrolling required. 在正常情况下，浏览器将包装内容，使得不需要任何水平滚动。 Provided the user has a normal-ish window size, you cause horizontal scrolling in your design by having elements that you've specified as being a certain width, either via style information or by having non-wrappable content (like a big image). 如果用户具有正常窗口大小，则通过将指定为特定宽度的元素（通过样式信息或具有不可包装的内容（如大图像））导致设计中的水平滚动。 For instance, this won't require horizontal scrolling: 例如，这不需要水平滚动：
<p>...lots of text here...</p>
...but this will: ......但这会：
<p style='width: 1200px'>...lots of text here...</p>
...if the user's browser window is less than 1200 pixels wide. ...如果用户的浏览器窗口宽度小于1200像素。
So if having the content off to the right unavailable isn't what you intend , my answer would be to find the elements causing the scrolling and correct them. 因此，如果将内容移至右侧不可用不是您想要的 ，我的答案是找到导致滚动的元素并更正它们。
解决方案2
6 2010-06-07 05:32:26
Apply following style to that element: 将以下样式应用于该元素：
overflow-x:hidden;
or it should be: 或它应该是：
overflow:auto;
overflow-x:hidden;
this will make sure that vertical scrolling is there when needed. 这将确保在需要时垂直滚动。
解决方案3
0 2010-06-07 06:06:46
If I understand your question correctly, you want to prevent your content from going beyond the boundaries of the browser window. 如果我正确理解您的问题，您希望防止您的内容超出浏览器窗口的范围。 Very often, designers set their layout widths to 960px in order to set a fixed width centered on the page, which fits nicely within a 1024px x 768px computer screen. 通常，设计人员将其布局宽度设置为960px，以便在页面中心设置固定宽度，这非常适合1024px x 768px计算机屏幕。 As per below comments, a smaller resolution computer would gain scrollbars because of this. 根据以下评论，较小分辨率的计算机会因此获得滚动条。 You would do that with something like: 你可以这样做：
<html>
<head>
</head>
<body>
<div style="width:960px; margin:0 auto;">
... The rest of your content goes here ...
</div>
</body>
</html>
You can read more about browser width here: 您可以在此处详细了解浏览器宽度：
http://www.fivefingercoding.com/web-design/is-there-a-perfect-web-design-width http://www.fivefingercoding.com/web-design/is-there-a-perfect-web-design-width
If you find that the content stretches beyond this width, then a specific item inside the page is too wide. 如果您发现内容超出此宽度，则页面内的特定项目太宽。 Look at the page yourself to identify what it might be, or provide a link to stack overflow for our help. 自己查看页面以确定它可能是什么，或者为我们的帮助提供堆栈溢出的链接。 To give you an example, having this inbetween the above div would be problematic: 举个例子，在上面的div之间有这个问题会有问题：
<table style="width:99999px;"> ... table stuff ... </table>
解决方案4
0 2010-06-07 06:08:11
如果你想在每个浏览器中使用它，你不应该为元素添加任何宽度，然后在每个浏览器中都不会出现水平溢出。
解决方案5
0 2010-06-07 11:26:34
if you want your html.body or div liquid; 如果你想要你的html.body或div液体;
div.sample{ width:100%;}
sample div will resize whether your screen big or small/ without scroller/ 样本div将调整大小，无论您的屏幕是大还是小/没有滚动/
解决方案6
-2 2010-06-07 05:43:03
如果使用浏览器查看文件，则可以通过将内容设置为百分比来设置内容的宽度。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.