18

フレーム内にHTMLページを埋め込む必要があり、次のコードを使用しています。

<iframe src="http://www.google.com" style="width: 90%; height: 300px"
    scrolling="no" marginwidth="0" marginheight="0" frameborder="0"
    vspace="0" hspace="0">

ここで行っているように高さをハードコーディングしなくても、フレームがページの長さに自動的にサイズ変更されるように、高さをautoに設定しようとしています。試しましたが、うまくheight:autoいきheight:inheritませんでした。

4

4 に答える 4

20

このコーディングを試してください

<div>
    <iframe id='iframe2' src="Mypage.aspx" frameborder="0" style="overflow: hidden; height: 100%;
        width: 100%; position: absolute;"></iframe>
</div>
于 2013-11-12T12:10:48.057 に答える
10

ブートストラップに関するSolomonの回答は、ブートストラップソリューションが使用するCSSを追加するように私を刺激しました。これは、私にとって非常にうまく機能します。

.iframe-embed {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    height: 100%;
    width: 100%;
    border: 0;
}
.iframe-embed-wrapper {
    position: relative;
    display: block;
    height: 0;
    padding: 0;
    overflow: hidden;
}
.iframe-embed-responsive-16by9 {
    padding-bottom: 56.25%;
}
<div class="iframe-embed-wrapper iframe-embed-responsive-16by9">
    <iframe class="iframe-embed" src="vid.mp4"></iframe>
</div>
于 2018-11-08T16:21:58.147 に答える
4

Bootstrapのようなフレームワークの場合、次のスニペットを使用して、任意のiframeビデオをレスポンシブにすることができます。

<div class="embed-responsive embed-responsive-16by9">
    <iframe class="embed-responsive-item" src="vid.mp4" allowfullscreen></iframe>
</div>
于 2018-05-07T22:10:32.990 に答える
2

サイトが別々のドメインにある場合、ブラウザ間のドメイン制限のため、呼び出し元のページはiframeの高さにアクセスできません。両方のサイトにアクセスできる場合は、ドキュメントドメインハックを使用できる可能性があります。次に、anroestiのリンクが役立つはずです。

于 2013-03-06T21:47:08.363 に答える