目次
質問
iframe と Frame の違い
ホームページ ウェブフロントエンド htmlチュートリアル HTML Framework_html/css_WEB-ITnose の iframe、frame、frameset の関連属性の概要

HTML Framework_html/css_WEB-ITnose の iframe、frame、frameset の関連属性の概要

Jun 24, 2016 am 11:50 AM

質問

1. iframe と Frame の違いを知っていますか?

2. フレームセットおよびその他の関連属性を使用したことがありますか?

iframe と Frame の違い

プロジェクトで Frameset 属性を使用したかどうかはわかりません。昨年、オンライン カスタマー サービス システムの制作で、frameset 属性が使用されました。上のものは固定レイアウトが必要です。そのときのフレームセットとフレームを待ちましょう。これらの属性を使用した後、iframe と Frame の違いが理解できました。これまでは、プロジェクトでフレームを使用することはほとんどなく、使用する場合は iframe を使用していたからです。

以下で具体的な違いについて説明しましょう。以下に要点をまとめます。

1. FrameSet から独立して使用することはできません。

2. フレームを body に配置することはできません。

<!--<body>--> <frameset rows="50%,*"> <frame name="frame1" src="test1.htm"/> <frame name="frame2" src="test2.htm"/> </frameset> <!--<body>--> 
ログイン後にコピー
以下は正常に表示できません。
<body> <frameset rows="50%,*"> <frame name="frame1" src="test1.htm"/> <frame name="frame2" src="test2.htm"/> </frameset> <body> 
ログイン後にコピー

逆に、iframe がframeSet 属性の下に配置されている場合は、body に配置する必要があります

 <body> <frameset> <iframe name="frame1" src="test1.htm"/> <iframe name="frame2" src="test2.htm"/> </frameset> </body> 
ログイン後にコピー

3. iframe は HTML タグであり、HTML 内のどこでも使用できますが、frame は使用できません。

<body> <iframe name="frame1" src="test1.htm"/> <iframe name="frame2" src="test2.htm"/> </body> <table> <tr> <td><iframe id="" src=""></iframe></td><td></td> </tr> </table> 
ログイン後にコピー

フレームは、frameSet 内でネストされている必要があり、table などのタグ内で使用することはできません。

4. フレームの高さは、frameSet を通じてのみ制御できます。iframe はそれ自体で制御できますが、frameSet によって制御することはできません。 IE では正常に表示されます。Firefox では最初のフレームのみが表示されます。2 つ以上のフレームを使用すると、IE と Firefox の両方で正常に動作します

フレームセット関連のプロパティの紹介

border

フレームの境界線の太さを設定します。

bordercolor

フレームの枠線の色を設定します。

frameborder フレーム枠を表示するかどうかを設定します。設定値は 0 と 1 のみで、0 は境界線なし、1 は境界線を表示することを意味します。

cols

ページを垂直に分割します。数値表現方法は「30%、30(または30px)、」の3通りあり、値の個数は分割ウィンドウ数を表し、値は「,」で区切られます。 「30%」は、フレーム領域がブラウザ ページ領域全体の 30% を占めることを意味します。「30」は、領域の横幅が 30 ピクセルであることを意味します。「」は、その領域が残りのページ領域を占めることを意味します。例:cols="25%,200,*" は、ページを 3 つの部分に分割することを意味します。左側の部分はページの 25% を占め、中央の水平幅は 200 ピクセル、ページの残りの部分は右側です。一部。

ページを水平に分割します。数値の表現方法や意味はcolsと同じです。

framespacing

フレーム間の予約スペース距離を設定します。

使い方

<!--<body>--> <frameset rows="50%,*"> <frame name="frame1" src="test1.htm"/> <frame name="frame2" src="test2.htm"/> </frameset> <!--</body>--> <body> <frameset> <iframe height="30%" name="frame1" src="test1.htm"/> <iframe height="100" name="frame2" src="test2.htm"/> </frameset> </body> 
ログイン後にコピー

js選択の各部分のレイアウトとレンダリングは次のとおりです:

私はhaoroomsフロントエンドブログのオリジナル記事です!転載の際はご一報ください!ソースアドレスは http://www.haorooms.com/post/html_frameset_contro です


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

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AI Hentai Generator

AIヘンタイを無料で生成します。

ホットツール

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

&lt; Progress&gt;の目的は何ですか 要素? &lt; Progress&gt;の目的は何ですか 要素? Mar 21, 2025 pm 12:34 PM

この記事では、HTML&lt; Progress&gt;について説明します。要素、その目的、スタイリング、および&lt; meter&gt;との違い要素。主な焦点は、&lt; Progress&gt;を使用することです。タスクの完了と&lt; Meter&gt; statiの場合

HTMLは初心者のために簡単に学ぶことができますか? HTMLは初心者のために簡単に学ぶことができますか? Apr 07, 2025 am 12:11 AM

HTMLは、簡単に学習しやすく、結果をすばやく見ることができるため、初心者に適しています。 1)HTMLの学習曲線はスムーズで簡単に開始できます。 2)基本タグをマスターして、Webページの作成を開始します。 3)柔軟性が高く、CSSおよびJavaScriptと組み合わせて使用​​できます。 4)豊富な学習リソースと最新のツールは、学習プロセスをサポートしています。

&lt; datalist&gt;の目的は何ですか 要素? &lt; datalist&gt;の目的は何ですか 要素? Mar 21, 2025 pm 12:33 PM

この記事では、HTML&lt; Datalist&GT;について説明します。オートコンプリートの提案を提供し、ユーザーエクスペリエンスの改善、エラーの削減によりフォームを強化する要素。

&lt; meter&gt;の目的は何ですか 要素? &lt; meter&gt;の目的は何ですか 要素? Mar 21, 2025 pm 12:35 PM

この記事では、html&lt; meter&gt;について説明します。要素は、範囲内でスカラーまたは分数値を表示するために使用され、Web開発におけるその一般的なアプリケーション。それは差別化&lt; Meter&gt; &lt; Progress&gt;およびex

ビューポートメタタグとは何ですか?レスポンシブデザインにとってなぜそれが重要なのですか? ビューポートメタタグとは何ですか?レスポンシブデザインにとってなぜそれが重要なのですか? Mar 20, 2025 pm 05:56 PM

この記事では、モバイルデバイスのレスポンシブWebデザインに不可欠なViewportメタタグについて説明します。適切な使用により、最適なコンテンツのスケーリングとユーザーの相互作用が保証され、誤用が設計とアクセシビリティの問題につながる可能性があることを説明しています。

&lt; iframe&gt;の目的は何ですか タグ?使用する際のセキュリティ上の考慮事項は何ですか? &lt; iframe&gt;の目的は何ですか タグ?使用する際のセキュリティ上の考慮事項は何ですか? Mar 20, 2025 pm 06:05 PM

この記事では、&lt; iframe&gt;外部コンテンツをWebページ、その一般的な用途、セキュリティリスク、およびオブジェクトタグやAPIなどの代替案に埋め込む際のタグの目的。

HTML、CSS、およびJavaScriptの役割:コアの責任 HTML、CSS、およびJavaScriptの役割:コアの責任 Apr 08, 2025 pm 07:05 PM

HTMLはWeb構造を定義し、CSSはスタイルとレイアウトを担当し、JavaScriptは動的な相互作用を提供します。 3人はWeb開発で職務を遂行し、共同でカラフルなWebサイトを構築します。

HTMLでの開始タグの例は何ですか? HTMLでの開始タグの例は何ですか? Apr 06, 2025 am 12:04 AM

Anexampleapalofastartingtaginhtmlis、それはaperginsaparagraph.startingtagsaresentionentientiontheyinitiateelements、definetheirtypes、およびarecrucialforurturingwebpagesandcontingthomedomを構築します。

See all articles