如何在移动设备的屏幕中设置我的 Iframe

Question

My css for Iframe:
position: absolute;
right: 0;
top: -100px;
z-index: 1;
height: 110%;
width: 100%;
border: none;
overflow-y: auto;
overflow-x: hidden;

这是我网站上的 CSS for Iframe 屏幕，但在移动设备中，我必须滚动 Iframe 屏幕才能看到完整的网站。 注意：使 iframe 响应不在我的手中。

Answer 1

引导方法。在其中使用 iframe 或视频元素。

<div class="embed-16by9">
<iframe src="..."></iframe>
</div>

使用响应式 CSS

embed-16by9 {
position: relative;
display: block;
width: 100%;
padding: 0;
overflow: hidden;
}
.embed-16by9::before {
display: block;
content: "";
padding-top: 56.25%; /* ratio 16:9 */
}
.embed-16by9 iframe,
.embed-16by9 video {
width: 100%;
border: 0;
position: absolute;
top: 0; bottom: 0; left: 0;
height: 100%;
}