frameset要素

説明

<frameset>-</frameset>　開始タグ:必須終了タグ:必須

frameset要素は、ウィンドウを各フレームに分割する要素です。分割された各フレームに対応する文書へのリンクはframe要素で行います。

frameset要素はnoframe要素を包含して、フレームをサポートしていないブラウザのために代替テキストを提供することもできます。

属性 (W3C)

<frameset

H4-x1 ie3- N2-

中心属性	id class style title
rows="マルチ長さのリスト"	H4-x1 ie3- N2- 上下に分割 [,]で区切られた割合のリストで指定。
cols="マルチ長さのリスト"	H4-x1 ie3- N2- 左右に分割 [,]で区切られた割合のリストで指定。
onload="スクリプト"	H4-x1 ie3- N2- ページロード後
onunload="スクリプト"	H4-x1 ie3- N2- ページ移動後

>((frameset|frame)+ & noframes?)</frameset>

ブラウザ独自の属性 (ie N)

border="ピクセル"

ie4- N3-
枠線の太さ

bordercolor="色"

ie4- N3-
枠線の色

frameborder="値"

ie3- N3-
枠線の表示

(1\|yes)	表示
(0\|no)	非表示

framespacing="ピクセル"

ie3-
枠線の太さ

name=""

ie4-
未調査

フレームの構造

フレームでは、文書本体<body>-</body>の代わりに、ほかの文書へのリンクを持つフレーム<frameset>-</frameset>を配置します。


<html>

<head>

<title>タイトル</title>

</head>


<frameset cols="150,*">

  <frame src="source1.htm" name="menu">

  <frame src="source2.htm" name="content">

</frameset>

</html>

文書ヘッダには、文書情報などのブラウザに表示されないいくつかの要素を配置します。
空白文字(space、new line、tab、及びコメント)は、上記3部分のどこに記述しても構いません。

仕様書において、HTMLのバージョンを示す<!DOCTYPE>の記述は必須ですが、ブラウザの独自属性を使用するためにHTMLの仕様書に従うことができない場合や、仕様書や表示モードなどがよくわからない場合、あるいは仕様書に従うつもりがない場合などは、<!DOCTYPE>の記述を避けるのもやむを得ないでしょう。

一般的な使用例

左フレーム

右フレーム

上フレーム

下フレーム

中央コンテンツ

frameset要素は、何階層にでも入れ子(ネスト)にすることができます。

目標フレームへの表示

デフォルトでフレーム内文書のリンクをクリックすると、クリックした同一フレーム内にリンク先文書が表示されます。指定したフレームに目的の文書を表示させるには、a要素やarea要素などの、target属性を使用します。


<frameset cols="150,*">

  <frame src="menu.htm" name="menu">

  <frame src="cont.htm" name="content">

</frameset>

このようなフレームで、menu.htm内のリンクを「name="content"」という目標フレームに表示させるには、menu.htm内のリンクを下記のように指定します


<a href="リンク先文書URI" target="content">コンテンツ</a>

frame要素の「name="content"」とa要素の「target="content"」が関連付けられ、contentフレームにリンク先の文書が表示されます。

name属性とtarget属性の関係

target属性では、リンク先の文書を開く目標フレームを指定することができます。ここで指定した目標フレームと、frame要素などのname属性のフレーム名を同じにすることで関連づけがおこなわれ、意図したフレームにリンク先の文書を表示させることができるようになります。
target属性は、リンクを生成する要素(a要素、link要素)、イメージマップ(area要素)、フォーム(form要素)において指定することができます。

フレームの解除

コンテンツページのリンク集などから、フレームを解除して今開いているウィンドウ内にリンク先を表示させたい場合などがあります。そのような場合には、a要素などのtarget属性に[_top]という値を記述します。


<a href="リンク先文書" target="_top">

これで、すべてのフレームが解除されたウィンドウ内にリンク先を表示させることができます。

[_top]は、特別な意味を持つ予約済み目標フレームのひとつです。

枠線を消すための指定

W3Cの仕様にあるframe要素のframeborder属性を利用すると、フレームの枠を非表示に設定できますが、実際には、線が残ってしまいます。残った線も含めてフレームの枠線を完全に消すためには、IEやNetscapeの独自属性を指定する必要があります。frameset要素の属性に以下の3つの独自属性を追加します。


<frameset ... frameborder="0" framespacing="0" border="0">

Netscapeではフレームのサイズが変更できなくなるので注意が必要です。

デフォルト目標フレームの指定

同一文書内の多くのリンクが同じ目標フレームを指定している場合、base要素のtarget属性を用いることで、目標リンクを1度だけ指定し、a要素などの各要素からtarget属性を省くことができます。

1度のクリックで複数フレームの内容を変更する方法

一度のクリックで複数フレームの内容を変更するためには、JavaScriptなどのスクリプトを使用します。


<script language="javascript" type="text/javascript"><!--

function turn1(){

  top.cont1.location.href="page1.htm";

  top.cont2.location.href="page2.htm";

}

function turn2(){

  parent.cont1.location.href="cont1.htm";

  parent.cont2.location.href="cont2.htm";

}

//--></script>

...

<a href="javascript:turn1();">turn1</a><br>

<a href="javascript:turn2();">turn2</a>

...

frameset要素 フレーム本体 (window subdivision)

説明