HTMLファイルを作ってみよう

左右のフレーム>>>上下のフレーム>>> 三画面フレーム>>>四画面フレーム>>>インラインフレーム

左と右に分けるフレームページの作り方

フレームページは最低でも三つのHTMLファイルから作られています。
最初に二つのページを呼び出すページ(頭になるページ)を作ります。
下のソースでHTMLファイルを作ってください。
トップページにするならindex.htmlで、トップ以外ならa.htmlとかb.htmlなど
タイトルを入れるは好きなタイトルに変更します。
15%,85%は左と右に表示される大きさですので、数字を変更してもいいです。
メニューを固定したいのであれば、15%,85%を150,* と数字でメニューを指定してください。

<html>
<head>
<title>タイトルを入れる</title>
</head>
<frameset cols="15%,85%" frameborder="yes" border="0">
<frame src="top2.html" name="2">
<frame src="top.html" name="1">
</frameset>
</html>


次に下のソースでtop2.htmlファイルとtop.htmlファイルを作ってください。

<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=Shift_JIS">
<title>HPのタイトルを入れます</title>
</head>
<body>

</body>
</html>

三つのHTMLファイルが作れたら、最初に作ったページを開くと、
top2.htmlファイルが左にtop.htmlファイルが右に表示されます。


top2.htmlファイルがメニューになりますので、top2.htmlファイルの中にリンクを入れます。
<a href="○○.html" target="1">文字</a>
掲示板とか日記は<a href="掲示板のアドレス" target="1">掲示板</a>
メニューが画像の場合は、
<a href="○○.html" target="1"><img src="画像の名前" border="0"></a>

なぜtarget="1"の指定が必要なのか説明すると、
最初に作ったページのメイン指定が
<frame src="top.html" name="1">
name="1"になっているでしょ。
name="○"とtarget="○"を同じに指定すれば、指定した場所に開くってことですね。


左右のページの区切り線を入れるのは、<frameset cols="15%,85%" frameborder="yes" border="0">
の部分のborder="0"を消してください。<frameset cols="15%,85%" frameborder="yes">

区切り線を固定するのは、noresizeを入れてください。
<frame src="top2.html" name="2" noresize>
<frame src="top.html" name="1" noresize>

区切り線に色を付けるのは、bordercolor="カラーコード"と入れます。
<frameset cols="15%,85%" frameborder="yes" bordercolor="カラーコード">


スポンサードリンク





玄関に戻るよ