Html Div垂直滚动条显示

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/838545/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-28 23:43:22  来源:igfitidea点击:

Div vertical scrollbar show

htmlcss

提问by Alec Smart

I am wondering how its possible to permanently show the vertical bar of a div (greyed out if there is no scrolling) similar to our regular bars. Basically I am trying to place an entire website in a div (like gmail/facebook), so if the page is not long enough the whole page shifts because of the lack of the vertical scroll bar.

我想知道如何永久显示 div 的垂直条(如果没有滚动,则显示为灰色)类似于我们的常规条。基本上我试图将整个网站放在一个 div(如 gmail/facebook)中,所以如果页面不够长,整个页面会因为缺少垂直滚动条而移动。

I need a solution to this problem. I tried overflow-y:scroll. But it doesn't seem to work at all.

我需要一个解决这个问题的方法。我试过溢出-y:滚动。但它似乎根本不起作用。

回答by Eoin Campbell

What browser are you testing in?

你在什么浏览器上测试?

What DOCType have you set?

你设置了什么DOCType?

How exactly are you declaring your CSS?

你究竟是如何声明你的 CSS 的?

Are you sure you haven't missed a ;before/after the overflow-y: scroll?

你确定你没有错过;之前/之后overflow-y: scroll

I've just tested the following in IE7 and Firefox and it works fine

我刚刚在 IE7 和 Firefox 中测试了以下内容,效果很好

<!-- Scroll bar present but disabled when less content -->
<div style="width: 200px; height: 100px; overflow-y: scroll;">
  test
</div>

<!-- Scroll bar present and enabled when more contents -->        
<div style="width: 200px; height: 100px; overflow-y: scroll;">
  test<br />
  test<br />
  test<br />
  test<br />
  test<br />
  test<br />
  test<br />
  test<br />
  test<br />
  test<br />
</div>

回答by kgiannakakis

Have you tried overflow-y:auto? It is not exactly what you want, as the scrollbar will appear only when needed.

你试过overflow-y:auto吗?这并不完全是您想要的,因为滚动条只会在需要时出现。

回答by Razan Paul

Always :If you always want vertical scrollbar, use overflow-y: scroll;

Always :如果您总是想要垂直滚动条,请使用overflow-y: scroll;

jsFiddle:

js小提琴:

<div style="overflow-y: scroll;">
......
</div>

When needed: If you only want vertical scrollbar when needed, use overflow-y: auto;(You need to specify a height in this case)

需要时:如果您只需要垂直滚动条,请使用 overflow-y: auto;(在这种情况下您需要指定高度)

jsFiddle:

js小提琴:

<div style="overflow-y: auto; height:150px; ">
....
</div>