ホームページ作成・HTML・アクセスアップ・スタイルシート・SEO・無料
ホームページ作成講座では、これからホームページを作成しようとしている人に、ホームページの作成方法を基本から、 HTML、スタイルシート、
アクセスアップ、アフィリエイトまで解説します。「初心者のかたにも分かる」を目標にしています。 このページがあなたのお役に立てれば幸いです。

横に分割するフレームを作る


<frameset cols="左のウィンドウ幅,右のウィンドウ幅">
<frame src="左に表示するHTMLファイル">
<frame src="右に表示するHTMLファイル">
</frameset>


フレームを使って画面を左右に分割するには、

フレームを設定するHTMLファイル、左に表示するHTMLファイル、右に表示するHTMLファイルの3つが必要になります。

まずはフレームを設定するHTMLファイルを作ります。今まではHTMLタグは<body>タグの中に書きましたが、

フレームを設定するときは代わりに<frameset>タグを使います。

左右に分割する場合はこの<frameset>タグcols属性をつけ、左右のウインドウの大きさを指定します。

画面に対して左のウインドウを20%、右のウインドウを80%にしたいときはcols="20%,80%"とします。

幅の指定は数値、%以外に*を使うこともできます。*は画面を100%として先に指定された%の残りを表します。

cols="20%,*"とすれば左が20%、右が80%になります。

次に<frame src="">を使って左右それぞれに表示するHTMLファイルを指定します。

ソース例
<html>
<head>
<title>左右に分割するフレーム</title>
</head>
<frameset cols="20%,80%">
<frame src="left.html">
<frame src="right.html">
</frameset>
</html>

左右に表示するleft.htmlとright.htmlのソースはとくに特別なことはないので省略します。

表示例はこちら


<< テーブルの「セル内の文字の位置を指定する」へ     「縦に分割するフレームを作る」へ >>



ホームページ作成とHTML>>HTML書き方講座>>横に分割するフレームを作る

©Copyright Hiroto.A ホームページ作成とHTML初心者 All Rights Reserved