如何将 html 锁定屏幕的尺寸动态设置为旋转 iPad 的尺寸？

Question

因此，我正在使用 HTML 制作锁定屏幕，并且我想让文本在 iPad 上以纵向和横向方式居中。
可以将其居中的唯一方法是使用

width: 1024px; height: 768px;

或

width: 768px; height: 1024px;

取决于方向。

我尝试过：

@media only screen and (device-width: 768px) and (orientation:portrait) {
  body {
    width: 768px;
    height: 1024px;
  }
} 

@media only screen and (device-width: 1024px) and (orientation:landscape) {
  body {
    width: 1024px;
    height: 768px;
  }
}

但无济于事。我想我可能需要js。

Answer 1

如果我理解正确的话，你可以尝试

width: 100%

，对于高度：

var windowHeight = $(window).height();
$('#element').css('height', windowHeight);