我使用html和javascript编写了一个文件。
在那里垂直滚动应该在那里,但我想停止水平滚动。
我该怎么做?
答案 0 :(得分:8)
Sarfraz有already mentioned overflow-x
,这是一个答案,虽然它意味着(正如它所说的那样!)任何可能已经向右移动的东西现在不可用到用户。有一些用例,但主要是不希望有用户无法访问的内容。
问题是:你为什么要进行水平滚动?在正常情况下,浏览器将包装内容,使得不需要任何水平滚动。如果用户具有正常窗口大小,则通过将指定为特定宽度的元素(通过样式信息或具有不可包装的内容(如大图像))导致设计中的水平滚动。例如,这不需要水平滚动:
<p>...lots of text here...</p>
......但这会:
<p style='width: 1200px'>...lots of text here...</p>
...如果用户的浏览器窗口宽度小于1200像素。
因此,如果将内容移至右侧不可用不是您打算,我的答案是找到导致滚动的元素并更正它们。
答案 1 :(得分:6)
将以下样式应用于该元素:
overflow-x:hidden;
或它应该是:
overflow:auto;
overflow-x:hidden;
这将确保在需要时垂直滚动。
答案 2 :(得分:0)
如果我正确理解您的问题,您希望阻止您的内容超出浏览器窗口的范围。通常,设计人员将其布局宽度设置为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>
您可以在此处详细了解浏览器宽度:
http://www.fivefingercoding.com/web-design/is-there-a-perfect-web-design-width
如果您发现内容超出此宽度,则页面内的特定项目太宽。自己查看页面以确定它可能是什么,或者为我们的帮助提供堆栈溢出的链接。举个例子,将这个放在上面的div之间会有问题:
<table style="width:99999px;"> ... table stuff ... </table>
答案 3 :(得分:0)
如果你想在每个浏览器中使用它,你不应该为元素添加任何宽度,然后在每个浏览器中都不会出现水平溢出。
答案 4 :(得分:0)
如果你想要你的html.body或div液体;
div.sample{ width:100%;}
示例div将调整大小,无论您的屏幕是大还是小/ 没有卷轴/
答案 5 :(得分:-2)
如果您使用浏览器查看文件,则可以通过将内容设置为百分比来设置内容的宽度。