如何强制HTML页面具有水平滚动条

Question

我正在使用HTML canvas和javascript制作游戏。目前，我头脑中的javascript会生成复杂的canvas元素。在身体只有一个小p与指示。游戏大约是1100px x 600像素。如果您使用较小分辨率的屏幕进入页面，则游戏的其余部分将从边缘剪切掉。我希望页面具有可用于滚动游戏的浏览器原生水平和垂直滚动条。

我已经看过容器和最小宽度的各种组合，但我想知道是否有一个标准的做法吗？

Answer 1

使用overflow-y和CSS

body {
   overflow-x: scroll; /*For regular vertical scroll */
   overflow-y: scroll; /*For Horizontal scroll */
}

Answer 2

CSS overflow属性，指定是否剪辑内容，渲染滚动条，或仅在其块级容器溢出时显示内容。

尝试将ID #scrollable添加到要强制滚动条的元素，然后

#scrollable{
    overflow: scroll;
    width: 100%;
}

来自MDN Docs

如果要在单个轴上强制溢出滚动，可以使用：

overflow-x: scroll;

或

overflow-y: scroll;

MDN Docs on overflow-x