フレームセット タグのデザイン ページに関する考慮事項

重要: タグを 内に置くことはできません。また、HTML5 では、frameset タグの使用がサポートされなくなりました。 ！ ！

1. Frameset 要素は、複数のウィンドウ (フレーム) を整理するために使用されるフレームセットを定義できます。各フレームワークには個別のドキュメントがあります。 フレームを使用すると、ページを分割して部分的に更新できます。合理的に使用すると、ユーザーに非常に優れたエクスペリエンスがもたらされます。

2. フレームセット のいくつかの 属性:

①、cols: は、フレームセット内の列の数とサイズを定義します。画面を垂直に切り取り (たとえば、左右 2 つの画面に)、整数値とパーセンテージを受け入れます。* は残りのスペースを占有することを意味します。値の数は分割ウィンドウの数を表し、カンマで区切られます。たとえば、COLS="30,*,50%" は 3 つのウィンドウに分割できます。最初のウィンドウは 30 ピクセルの幅を持ち、2 番目のウィンドウは 1 番目と 3 番目のウィンドウが割り当てられた後に残るものです。下のスペース、3 番目のウィンドウはウィンドウ画面全体の 50% を占め、幅は相対的に分割されます。数値は自分で調整できます。

②、rows:フレームセット内の行の数とサイズを定義します。画面の上下を区切る水平カットです。値の設定は上記と同じです。 Netacape ではこのタイプのフレームを表示できない場合があるため、COLS パラメータと ROWS パラメータを同じタグに配置しないようにしてください。そのため、複数の分割を使用するようにしてください。

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

④、枠線:枠の枠線の太さを設定します。

⑤、bordercolor: 枠の枠線の色を設定します。

⑥、framespacing: はフレーム間の距離とフレーム間に残されたスペースを表します。

3. フレームタグの属性:

①、name:フレーム名を設定します。このプロパティは設定する必要があります。

②, src: このフレームに表示するWebページの名前またはパスを設定します。このプロパティは設定する必要があります。

③、スクロール：スクロールバーを表示するかどうかを設定します。設定値はauto、yes、noです。

④、bordercolor: 枠の枠線の色を設定します。

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

⑥、noresize: フレームサイズを手動で調整できるかどうかを設定します。

⑦、marginwidth: フレームの境界とその内側のコンテンツの間の幅を設定します。

⑧、marginhight: フレームの境界とその中のコンテンツの間の高さを設定します。

⑨、幅: フレームの幅を設定します。

⑩、高さ: フレームの高さを設定します。

4. フレームセットの使用例:

以下の効果を実現したい場合

ページは上、左、右の 3 つの部分に分かれています。左側の ハイパーリンク をクリックすると、右側のフレーム ページがそれに応じて変更されます。

ページ全体: main.html

1 <frameset rows="11%,*" border="1px" framespacing="0">2         <frame src="top.html" name="top" frameborder="0" />3         <frameset cols="12%,*"   framespacing="0" framespacing="0">4             <frame src="left.html" name="left" scrolling="auto"/>5             <frame src="right.html" name="right" scrolling="auto"/>6         </frameset>7 </frameset>

top.html、right.html は空のページ、left.html は次のとおりです:

1 <!-- 左边菜单栏显示-->2     <p >3         <ul >4             <li ><a href="taskCreate.html" target="right" id="taskCreat">任务创建</a></li>5             <li ><a href="taskManage.html" target="right">任务管理</a></li>6             <li ><a href="#" target="right" >数据集管理</a></li>7             <li ><a href="#" target="right" >模型管理</a></li>8         </ul>9     </p>

ページの階層表示は主に Cols です。 Frameset タグ内での行の使用と、フレーム タグのネストとの組み合わせ。左側のメニュー バーをクリックすると、それに応じて右側のフレームが変化する場合は、リンクされたドキュメントを開く場所を規定する属性

target: を知っておく必要があります。ブラウザは、このタグの href 属性で名前が付けられ、名前がこのターゲットと一致するフレームまたはウィンドウにドキュメントをロードして表示します。つまり、main.html では、

、ここでの name 属性の値は何ですか、そして left.html では、 でなければなりません。平等であること。

5. 親ページが子ページに配置されているフレームセット内の他のフレームの要素を取得するにはどうすればよいですか?

つまり、right.htmlのleft.htmlのタグの属性値を取得する方法です。

$(parent.parent.mainFrame.

document).contents ().find( "body").html(); //manFrame は表示したいフレームの ID を指します

例えば、上記の left.html ページでは、タスク作成の ID は taskCreat です。次に、次のように取得して、そのクラス属性を変更します。

$(parent.parent.left.document).contents().find("#taskCreat").attr("class","list-group-item");

6. メリットとデメリットフレームセット

現在の HTML5 標準ではフレームセットがサポートされていないことがわかっていますが、フレームセットを使用する場合、ページ全体を再ロードする必要はありませんが、再ロードする必要があるのはページ内の 1 つのフレーム ページのみです (データ送信が削減され、Web ページが高速化されます)。 ） ダウンロード速度）。しかし、ブラウザの [戻る] ボタンが役に立たない、コードが複雑で、

検索 エンジンで検索するのが難しいなど、多くの欠点もあります。マルチフレーム ページを完全に表示すると、サーバーの http リクエストなどが増加します。したがって、フレームセットの使用には注意する必要がありますが、現在の p+CSS を使用してこの機能を実装することもできます。

以上がフレームセット タグのデザイン ページに関する考慮事項の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。