1. Home
  2. HTMLタグ
  3. フレームタグ
  4. ウィンドウの分割方法を指定する

ウィンドウの分割方法を指定する


<frameset></frameset>


frameset要素で、ウィンドウの分割方法を指定することができます。



<frameset rows="100,*"></frameset>

<frameset cols="100,*"></frameset>


属性 説明
rows="" ピクセル数、パーセント、相対比率 各フレームの高さを指定 (初期値は 100%
cols="" ピクセル数、パーセント、相対比率 各フレームの幅を指定 (初期値は 100%

横方向、または縦方向の分割を指定することができます。

  • rows="" … 横方向の分割を指定します(ウィンドウを上下に分割します)
  • cols="" … 縦方向の分割を指定します(ウィンドウを左右に分割します)

【サイズの指定と分割数について】

rows="" または cols="" の値には、各フレームのサイズをカンマ( , )で区切って指定します。

次の例では、上フレームの高さが20%、下フレームの高さが80%になります。(2分割を指定したことになります)

rows="20%,80%"

次の例では、左フレームの幅が20%、中フレームの幅が30%、右フレームの幅が50%になります。(3分割を指定したことになります)

cols="20%,30%,50%"

【相対比率の指定について】

各フレームのサイズは、相対比率で指定することもできます。整数の後にアスタリスク( * )を付けて指定します。

次の例では、最初の幅が100ピクセル、残りの幅が2:3で分配されることになります。

cols="100,2*,3*"

「*」だけで指定すると、「残り全て」を指定したことになります。次の例では、左フレームの幅が200ピクセル、右フレームの幅が残り全てになります。

cols="200,*"

【3分割を指定した例】

[サイズ指定の例]

cols="100,150,*"

上記の例では、左フレームの幅が100ピクセル、中フレームの幅が150ピクセル、右フレームの幅が残り全てになります。


使用例

■横方向に分割した例


<!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="100,150,*">

<frame src="example1.html">
<frame src="example2.html">
<frame src="example3.html">

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

</frameset>

</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 cols="20%,*">

<frame src="example1.html">
<frame src="example2.html">

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

</frameset>

</html>

表示例


フレームタグ

ページの先頭へ