CSS を使用して iframe コンテンツを元のサイズの 80% に拡大するにはどうすればよいですか?

iframe 内のコンテンツの拡大縮小

iframe のコンテンツを希望のサイズに拡大縮小するには、CSS 変換を利用できます。この場合の目標は、iframe を元のサイズの 80% で表示することです。

Kip のソリューションは、わずかな変更を加えることで、Opera や Safari などのブラウザでこれを実現できます。 CSS は次のように調整する必要があります:

#wrap { width: 600px; height: 390px; padding: 0; overflow: hidden; }
#frame { width: 800px; height: 520px; border: 1px solid black; }
#frame {
    -ms-zoom: 0.75;
    -moz-transform: scale(0.75);
    -moz-transform-origin: 0 0;
    -o-transform: scale(0.75);
    -o-transform-origin: 0 0;
    -webkit-transform: scale(0.75);
    -webkit-transform-origin: 0 0;
}

このコードでは、「-ms-zoom」プロパティは Internet Explorer に固有ですが、他の変換プロパティは他のブラウザに適用されます。 「scale」値を 0.75 に設定すると、iframe コンテンツが元のサイズの 75% に効果的に縮小されます。

さらに、外観を抑制するために、「frame」要素に「overflow: hidden」を設定することもできます。スクロールバーの。これにより、拡大縮小されたコンテンツが指定された寸法内に収まることが保証されます。

以上がCSS を使用して iframe コンテンツを元のサイズの 80% に拡大するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。