インラインフレームのリンク設定(ちょこっとHTML)

メール配信システムは月額1050円から

ホームページは難しくない  ちょこっとHTML  Lesson8

<flame src="○" name="○"> 〜 </flame>
<a href="○" target="○"> 〜 </a>

インラインフレームに リンクを指定して 指定したページを
フレーム内に読み込ませて表示させることができます。

 

まず 下のサンプルを見てください。

mamoho

だいすけ

なみ

Topへ

 

以前に フレームのリンクのところでもお話しましたが、
これも やり方は同じで まずインラインフレームに名前をつけ
リンク先のターゲットに そのフレーム名を指定します。

 

このフレーム部分の構成は 1行2列のテーブルに
左側のセルはリンクメニュー 右側のセルには インラインフレームを表示しています。

 

インラインフレームの構成は

フレーム名は  mainflame
フレームの幅は 400ピクセル 高さ 300ピクセル
フレーム内のトップページは  iflame07_top.html

です。

 

 

では さっそくやってみましょう。

 

まず インラインフレームに名前を付けます。

<iframe src="iframe07_top.html" width="400" height="300" name="mainflame"></iframe>

これで インラインフレームに名前がつきました。

 

次に リンク側の設定です。

まず mamohoのページを インラインフレームに表示させます。
リンク先のtarget属性に mainflame を 指定します。
mamohoのページのファイル名は iflame07_a.html ですので、

<a href="iframe07_a.html" target="mainflame">mamoho</a>

となります。

 

他のリンクも設定していきましょう。

<p><a href="iframe07_a.html" target="mainflame">mamoho</a></p>
<p><a href="iframe07_b.html" target="mainflame">だいすけ</a></p>
<p><a href="iframe07_c.html" target="mainflame">なみ</a></p>
<p><a href="iframe07_top.html" target="mainflame">Topへ</a></p>

 

だいたいの感じがつかめたでしょうか?

 

ホームページは難しくない  ちょこっとHTML  Lesson8

当ホームページは リンクフリーです! 
Copyright (C) 2006. mamoho. All Rights Reserved.
掲載の記事・写真・イラストなど、すべてのコンテンツの無断複写・転載・公衆送信等を禁じます。