Html 仅在移动设备上制作iframe全屏的最佳方法是什么？

我有一个iframe，我只想在手机上全屏显示。我看到了在所有屏幕上全屏显示的解决方案，但这不是我想要的

以下是我目前的代码：

要覆盖整个视口，可以使用：

<p align="center">
<iframe src="LINK" title="iframe" style="position:fixed; top:0px; left:0px; bottom:0px; right:0px; width:100%; height:100%; border:none; margin:0; padding:0; overflow:hidden; z-index:999999;" frameBorder="0">
</iframe>
</p>

---

只需使用媒体查询：

<iframe class="iframe" src="https://www.google.com/" frameborder="0"></iframe>

.iframe {
  width: 100vw;
  height: 100vh;
}

@media (min-width: 600px) {
  .iframe {
    width: 600px;
    height: 600px;
  }
}

.iframe{
宽度：100vw；
高度：100vh；
}
@介质（最小宽度：600px）{
.iframe{
宽度：600px；
高度：600px；
}
}

---

如何编写只会使iframe在移动设备上全屏显示，而不是在桌面上显示的媒体查询？

<iframe class="iframe" src="https://www.google.com/" frameborder="0"></iframe>

.iframe {
  width: 100vw;
  height: 100vh;
}

@media (min-width: 600px) {
  .iframe {
    width: 600px;
    height: 600px;
  }
}