如何使所有元素在 CSS 中拉伸？

Question

我正在用 React 制作一个简单的网页游戏，我想在尽可能多的屏幕上测试它（4:3、16:9、16:10、21:9）。我知道我可以让游戏响应每个屏幕尺寸，但这不是我想要的，我想让屏幕尺寸完全拉伸。

我的 html 正文：“100vh 和 100vw”（因为游戏没有页面滚动，所以它仍然保持全屏）

Example

......... ty s2 .........

编辑 1：

为了拉伸元素，我使用 vh 和 vw 测量值，例如：

#img {
width: 10vw;
height: 15vh
}

也许解决我的问题的方法是在主体中保留一个固定的分辨率（例如 1280x720），然后我会创建带有像素测量值的普通元素（imgs/divs），它们会拉伸

Answer 1

不太确定您要实现的目标，但也许 object-fit 是您正在寻找的 css 属性：docs。