如何仅在移动模式下以全屏模式显示图像？

Question

桌面上有两个站点模板（已经可以）和移动站点模板。

在手机中，我希望它只显示占据整个屏幕的图像。显示器的所有扩展名（高度和宽度）必须只是这个内容。按下按钮后，页面向下并显示内容。

例：

我做一个例子小提琴jsfiddle.net/gtw7375/yrmbsfhu/

但我不知道我怎么能中心的形象，把它作为独特的内容占据整个高度/页面高度。

如何做到这一点？

Answer 1

创建一个设置为100vw和100vh的块元素。然后添加图像作为背景图像与属性：background-size：cover。