<frameset></frameset>

ブラウザ
  • IE
  • Cr
  • Sf
  • Fx
  • O
分類 ---
要素

frameset要素を入れ子にすると、上下左右の分割を組み合わせることができます。

ウィンドウを左右に分割し、右側のフレームを更に上下に分割した例

まずはサンプル画面で分割の例をご覧ください。

サンプル画面へ新規ウィンドウで表示

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
<html>
<head>
<title>文書のタイトル</title>
</head>

<frameset cols="200,*"> … 左右の分割を指定

<frame src="example1.html"> … 左のフレームに example1.html を表示

<frameset rows="100,*"> … 上下の分割を指定
<frame src="example2.html"> … 上のフレームに example2.html を表示
<frame src="example3.html"> … 下のフレームに example3.html を表示
</frameset> … 上下の分割を終了

<noframes>
<body>
<p>フレームの代替内容</p>
</body>
</noframes>

</frameset> … 左右の分割を終了

</html>

上記の例では、まず左右の分割を指定して、左フレームに example1.html を読み込んでいます。続いて右フレームの部分で上下の分割を指定し、example2.html と example3.html をそれぞれのフレームに読み込んでいます。

読み込みの指定が完了したら、まずは上下の分割を終了し、続いて左右の分割を終了します。

入れ子をうまく使うことで、様々な分割レイアウトを作成することができます。

使用例


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
<html>
<head>
<title>文書のタイトル</title>
</head>

<frameset rows="10%,80%,10%">
<frame src="example_a.html">

        <frameset cols="100,*,100">
        <frame src="example_a.html">

                <frameset rows="50%,50%">
                <frame src="example_b.html">
                <frame src="example_a.html">
                </frameset>

        <frame src="example_a.html">
        </frameset>

<frame src="example_a.html">

<noframes>
<body>
<p>フレームの代替内容</p>
</body>
</noframes>

</frameset>

</html>
表示例

サンプル画面へ新規ウィンドウで表示