ホームページ >よくある問題 >iframe にはどのような属性がありますか?

iframe にはどのような属性がありますか?

小老鼠
小老鼠オリジナル
2023-08-23 15:27:398738ブラウズ

iframe 属性には、src 属性、幅と高さの属性、frameborder 属性、scrolling 属性、allowfullscreen 属性、sandbox 属性、name 属性などが含まれます。詳細な紹介: 1. src 属性、埋め込む Web ページまたはドキュメントの URL を指定するために使用されます; 2. width 属性と height 属性は、iframe の幅と高さを指定するために使用され、ピクセル値を使用して設定できます。またはパーセンテージ; 3. フレームボーダー属性などは待機します。

iframe にはどのような属性がありますか?

このチュートリアルの動作環境: Windows 10 システム、Dell G3 コンピューター。

iframe は、Web ページに別の Web ページまたはドキュメントを埋め込むために使用される HTML のタグです。これには、埋め込みコンテンツのプレゼンテーションと動作を制御するために使用できるプロパティがあります。

1. src 属性: src 属性は、埋め込む Web ページまたはドキュメントの URL を指定するために使用されます。たとえば、 は、example.html という名前のページを現在のページ内に埋め込みます。

2. width 属性と height 属性: width 属性と height 属性は、iframe の幅と高さを指定するために使用されます。ピクセル値またはパーセンテージを使用して設定できます。たとえば、 は、iframe の幅を 500 ピクセルに、高さを 300 ピクセルに設定します。

3. Frameborder 属性: Frameborder 属性は、iframe の境界線を表示するかどうかを指定するために使用されます。 0または1に設定できます。 0 に設定すると枠線は表示されず、1 に設定すると枠線が表示されます。たとえば、 は枠線を表示せずに example.html を埋め込みます。

4.scrolling属性:scrolling属性は、スクロールバーを表示するかどうかを指定するために使用されます。 「はい」、「いいえ」、または「自動」に設定できます。 「yes」に設定するとスクロール バーは常に表示され、「no」に設定するとスクロール バーは表示されません。auto に設定すると、コンテンツのサイズに応じてスクロール バーが自動的に表示または非表示になります。たとえば、 は、example.html のコンテンツ サイズに基づいてスクロール バーを表示または非表示にします。

5.allowfullscreen 属性:allowfullscreen 属性は、埋め込みコンテンツの全画面表示を許可するかどうかを指定するために使用されます。 true または false に設定できます。 true に設定すると全画面表示が許可され、false に設定すると全画面表示が許可されません。たとえば、 により、example.html を全画面モードで表示できるようになります。

6. サンドボックス属性: サンドボックス属性は、iframe 内のコンテンツがサンドボックス環境で実行されるかどうかを指定するために使用されます。 allow-forms、allow-same-origin、allow-scripts、allow-top-navigation、またはそれらの組み合わせに設定できます。たとえば、 は、サンドボックス環境で example.html のスクリプトを実行します。

7. name 属性: name 属性は、他の場所で参照する iframe の名前を指定するために使用されます。たとえば、 は、link を使用して他の場所で参照できます。

これらのプロパティを必要に応じて組み合わせて、埋め込みコンテンツを制御できます。 iframe 属性を合理的に使用すると、Web ページ上に複数のコンテンツを同時に表示でき、ユーザー エクスペリエンスと Web ページの機能が向上します。

以上がiframe にはどのような属性がありますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

関連記事

続きを見る