ホーム>レベルアップ情報一覧>フレーム内に表示されるページを読み込もう!
フレーム内に表示されるページを読み込もう!(frame 要素、src 属性)
使用タグ <frame>タグ
HTML一覧タグ辞典 … <frame> タグ
<frame>タグは<frameset>〜</frameset>の中に記述し、<frame>タグの src 属性でフレームに表示されるページを読み込むことができます。属性はその他に name 属性、frameborder 属性、marginwidth 属性、marginheight 属性、noresize 属性、scrolling 属性、longdesc 属性などがあります。また、このタグは内容を持ちません。
| 属性 |
読み |
説明 |
| name 属性 |
ネーム |
フレームに名前を指定できます。<a>タグのtarget属性を使いname属性で指定したフレームを名前を指定すれば、リンク先のページをそのフレームで表示できます。 |
| frameborder 属性 |
フレームボーダー |
フレームの境界線を非表示にできます。値には「1」または「0」を指定できます。「1」を指定した場合は境界線が表示され、「0」を指定した場合は境界線は非表示になります。 |
| marginwidth 属性 |
マージンウィドス |
フレームの左右に空ける空白をピクセル数を表す整数で指定します。 |
| marginheight 属性 |
マージンハイト |
フレームの上下に空ける空白をピクセル数を表す整数で指定します。 |
| noresize 属性 |
ノーリサイズ |
フレームの境界線のサイズ変更ができないようにします。指定できる値は「noresize」のみです。 |
| scrolling 属性 |
スクローリング |
スクロールバーの付け方を変更できます。「auto」、「yes」、「no」のいずれかを指定できます。値に「auto」を指定した場合は自動的にスクロールバーが表示されます。「yes」を指定した場合はスクロールバーが付きます。「no」を指定した場合はスクロールバーが付きません。 |
| longdesc 属性 |
ロングデスク |
このフレームに関する説明が title 属性で説明しきれないくらい長文の場合、フレームに関するページの URL を指定します。音声ブラウザなどのために用意された属性です。 |
使用タグ <frame src="URL">タグ
<frame>タグのsrc属性を使うと、フレーム内に読み込むページのURLを指定できます。値は相対パス、絶対パスで指定できます。
他人のサイトにリンクするには?!
ただ、普通に他人のサイトのURLを指定したらフレーム内に表示されてしまい、著作権に触れる恐れ(自分のサイトのように見えるので)があるので、<a>タグの target 属性で「_top」を指定し、いちばん上位のウィンドウに表示しフレームを解除しましょう!もしくは別ウィンドウで表示しましょう!
使用例
では、実際にフレーム内に読み込むページのURLを指定しましょう!ここでは<frameset>タグの cols 属性の属性値を「20%,75%」と指定して左右に分割しているので、最初に指定したページが左側のフレーム(25%で表示)で表示され、後に指定したページが右側のフレーム(75%で表示)で表示されます。
frame要素のsrc属性を使い、フレーム内に読み込むページのURLを指定します。まずは、左側に表示するファイル名「menu.html」というページを指定します。
- まず<frame src="menu.html">と入力します
|
記述例
<frameset cols="25%,75%">
<frame src="menu.html">
</frameset> |
|
|
| |
 |
右側に表示するファイル名「main.html」というページを指定します。
- <frame src="main.html">と入力します
|
記述例
<frameset cols="25%,75%">
<frame src="menu.html">
<frame src="main.html">
</frameset> |
|
|
このように入力すると左側のフレームにファイル名「manu.html」が読み込まれ、右側のフレームにファイル名「main.html」が読み込まれます。
使用例の表示
[frame要素のsrc属性を指定した場合の表示例]
| 一人暮らしの前向きな料理 |
| ファイル名「memu.html」のページが表示されます |
ファイル名「main.html」のページが表示されます |
|
|