假设我有一个静态网页，整个页面都被包裹起来，假设宽度为700px，现在，如果页面的内容太长，则会(显然)出现一个滚动条。但是，滚动条的外观会将所有内容向左移动，像几个像素(适合页面右侧滚动条所需的像素)。我想做的就是删除这种“移动”效果，这样，如果需要滚动条，则不会以任何方式影响页面的内容。
我不知道我是否说清楚了。
假设这是一个网页:
| .... contentcontent ........ |
| .... contentcontent ........ |
| .... contentcontent ........ |
| .... contentcontent ........ |
| .... contentcontent ........ |
| .... contentcontent ........ |
| .... contentcontent ........ |
这就是滚动条的外观:
| ..... contentcontent ................... |
| ..... contentcontent ................... |
| ..... contentcontent ................... |
| ..... contentcontent ................... |
| ......内容内容.......... | |
| ..... contentcontent .......... | |
| ..... contentcontent ................... |
但我想要这样的东西:
| ......... contentcontent ...... | |
| ......... contentcontent ...... | |
| ......... contentcontent ...... | |
| ......... contentcontent ...... | |
| ......... contentcontent ...... | |
| ......... contentcontent ...... | |
| ......... contentcontent ...... | |
点代表空格，内容代表网页内容，右边的列代表滚动条。
最佳答案
您可以将overflow-y: scroll设置为 body 规则。这将始终显示垂直滚动条，除非内容足够长才能滚动，否则垂直滚动条将被禁用。这样，当内容足够长以至于您可以实际滚动并且不需要脚本来进行此工作时，内容就不会向左移动。