1. ホーム
  2. Web制作
  3. HTML/Xhtml

フレームセットの高さを設定します。インターフェースの変形を解決する

2022-01-16 14:29:27
現在、以下のようなインターフェイスのプロジェクトに取り組んでいます。

これはフレームセットを使って行われ、ワイドスクリーンで問題なく開発されましたが、あるユーザーが800*600のマシンでテストして、インターフェイス全体が歪んでいることに気づきました。
当時、フレームセット・ページ全体の高さは600ピクセルしかなく、フレームセットのネストしたフレームにはスクロールバーがあり、実に醜いものでした。フレームセットの高さを高く設定して、ネストされたフレームページにはスクロールバーがなく、フレームセットにはあるようにするにはどうしたらよいでしょうか?
フレームセットの高さを、例えば <frameset rows="110,*" style="height: 1900px;"> のように設定することができません。このとき、ページの高さは画面の高さのままで、1900pxではありません。framesetの本体の高さを設定しても無効です。何をすべきか?私は何日もbaiduは、答えを見つけることができなかった、問題は保留にされている。DIV+CSSでframesetを置き換えることをアーティストに依頼することも考えましたが、関わるコンテンツが多すぎるし、変更するにも作業量が多すぎるかもしれないと思い、あきらめることにしました。
1ヶ月前からこの問題に取り組んでいましたが、今日突然iframeで、フレームセットを入れ子にして、iframseのページの高さを設定したら効果が出てきたのです。今、同じ問題に遭遇して解決できなかった同僚と解決策を共有します。
1、フレームセットページ(inner.html)
コピーコード
コードは以下の通りです。

<html>
<frameset rows="110,*" frameborder="no" border="0" framespacing="-4px">
<frame src="header.jsp" name="topFrame" scrolling="no" noresize="noresize" />
<frameset cols="170,12,*" framespacing="0" frameborder="no" border="0" id="mainFrameset ">
<frame src="left.jsp" name="leftFrame"scrolling="auto" noresize="noresize" id=" leftFrame"/>
<frame src="narrow.jsp" scrolling="no" noresize="noresize"/>
<frame src="" name="mainFrame" noresize="noresize" />
</frameset>
</frameset>
<noframes>
</noframes>
</html>

2、iframeページ(outer.html)
このページの高さを、どれだけ高く設定するかがポイントです。その中に含まれるフレームセットもその高さになります。
コピーコード
コードは以下の通りです。

<body style="margin: 0px;height: 580px;width:960px;">
<iframe src="inner.html"
style="height:100%;width:100%;border-width: 0px;">
</iframe>
</body>