HTML講座 フレーム(画面の分割)


1.フレームの定義


<frameset>〜</frameset> フレームであることを定義 フレーム機能を使うと、1つのブラウザをいくつかに区切って、表示させることができます ※フレーム機能を使うと表示が遅くなるので使いすぎには気をつけましょう! オプション  cols=横に分割 (ピクセル数または%で分割)  rows=縦に分割 (ピクセル数または%で分割) 数値の変わりに*(アスタリスク)を利用して、自動的に計算させる方法もあります <frame src="表示するファイルのURL"> フレームの内容を指定 オプション  name=ウインドウ名  margineheight=フレームと中のテキストの縦の間隔(マージン)  marginewidth=フレームと中のテキストの横の間隔(マージン)   scrolling=スクロールバーの表示,非表示 (yes,no,auto)  frameborder=ボーダ表示の有無 (0,1)  noresize フレームの境界を固定 (例) <frameset cols="30%,70%" > <frame src="test01.html"> <frame src="test02.html"> </frameset>  (結果[イメージ])
test01test02
(例) <frameset cols="200,*" frameborder=0> <frame src="test01.html"> <frameset rows="10%,90%"> <frame src="test02.html"> <frame src="test03.html" name="window01"> </frameset> (結果[イメージ])
test01test02
test03


2.分割したウインドウにリンクをロード


<a href="表示するファイルのURL" target="ウインドウの名前">

通常、リンクを指定するとリンクタグのあるウインドウにロードされます

targetオプションで、分割したウインドウ(名前を付けておく)にリンクをロードする



(例)

<a href="test04.html" target="window01"> 

name="window01"と書かれたウインドウにtest04.htmlがロードされる



3.フレームに対応してないブラウザに


<noframe>〜</noframe>

フレーム機能のないブラウザでフレームのページにアクセスすると、何も表示されません

そこで、フレームに対応してないブラウザに対して表示を



(例)

<noframe>

このページはフレームを利用しています

フレーム未対応のブラウザでは見れません

</noframe>



4.フローティングフレーム


<iframe src="表示するファイルのURL">

フローティングフレームを作成することができます



オプション

name=フレーム名

scrolling=スクロールの有無 (yes,no)

frameborder=ボーダ表示の有無 (0,1)

marginwidth=フレーム内の左右のマージン

margineheight=フレーム内の上下のマージン

width=フレームの横幅

height=フレームの縦幅

aling=テキストの回り込み (top,middle,bottom,left,right)



(例)

<iframe src="http://www.yahoo.co.jp"></iframe>

(結果)



                   

戻る