<TABLE BORDER="10">
<TR> <TH>場所/月 </TH> <TH>東京</TH> <TH>札幌</TH> <TH>仙台</TH> </TR>
<TR> <TD>1月</TD> <TD> 5.0</TD> <TD>-3.1</TD> <TD>-1.1</TD> </TR>
<TR> <TD>2月</TD> <TD> 6.5</TD> <TD>-2.2</TD> <TD>-0.5</TD> </TR>
<TR> <TD>3月</TD> <TD> 8.5</TD> <TD>3.5</TD> <TD>4.5</TD> </TR>
<TR> <TD>4月</TD> <TD>12.7</TD> <TD>6.5</TD> <TD>7.5</TD> </TR>
<TR> <TD>5月</TD> <TD>18.3</TD> <TD>10.5</TD> <TD>12.7</TD> </TR>
<CAPTION>日本の気温</CAPTION>
</TABLE>
表の構成は<TABLE BORDER="10">で始まり、</TABLE>でおわります。
表の各行、すなわち横の1列毎に<TR> ... </TR>ではさみます。
最初の行は表のヘッダ部分すなわち、項目を書くときに使います。ここでは、場所/月、東京、札幌、仙台
が表題の項目です。
この時各項目は項目ごとに<TH>..</TH>ではさんでおきます。
項目の数だけこれを書きます。
3行目以降はデータの記述になります。
ここでも、全体を<TR> ... </TR>ではさむことは同じです。
ただ、項目は各データごとに
<TD> *** </TD>ではさんでおきます。
ここで***には数値または文字を書きます。
罫線をつける命令はBORDERです。整数を増やすと罫線の太さがかわります。
実際、数値を変えてください。特に0とすれば罫線は描かれません。
表題は<CAPTION> ... </CAPTION>で指定します。表題は通常は上につきますが、
下につけることもできます。その時は次のようにします。ここで...のところには文字が入ります。
<CAPTION ALIGN=bottom> ... </CAPTION>
また表はセンタリングをすることもできます。そのためには
< CENTER >と< /CENTER > を表の前後につければできます。
次に例を示します。上の場合にはブラウザでは次のように見えます。
場所/月 | 東京 | 札幌 | 仙台 |
---|---|---|---|
1月 | 5.0 | -3.1 | -1.1 |
2月 | 6.5 | -2.2 | -0.5 |
3月 | 8.5 | 3.5 | 4.5 |
4月 | 12.7 | 6.5 | 7.5 |
5月 | 18.3 | 10.5 | 12.7 |
これをセンタリングすると次のようになります。
場所/月 | 東京 | 札幌 | 仙台 |
---|---|---|---|
1月 | 5.0 | -3.1 | -1.1 |
2月 | 6.5 | -2.2 | -0.5 |
3月 | 8.5 | 3.5 | 4.5 |
4月 | 12.7 | 6.5 | 7.5 |
5月 | 18.3 | 10.5 | 12.7 |
表の作成を応用して各自の時間割を作成してみよう。
この時,1月,2月、にはそれぞれ1限、2限が入ります。東京、札幌、仙台の項目には月曜日、火曜日、水曜日 などの曜日が入るでしょう。数値の欄には各自の授業科目名が入ります。たとえば次のようになるでしょう。 ここで授業がない日は空欄にしないで全角のスペースを入れておきました。 何も入れないと空欄がみにくくなります。
時間/曜日 | 月曜日 | 火曜日 | 水曜日 |
---|---|---|---|
1限 | 数学A | ||
2限 | ゼミ | ||
3限 | 数学B | ゼミ | 法学 |
4限 | 経済原論 | 歴史学 | |
5限 | 英語 |
できましたか。次にソースをかいておきます。最初は見ないでやってみましょう。
<TABLE BORDER="10">
<TR> <TH>時間/曜日 </TH> <TH>月曜日</TH> <TH>火曜日</TH> <TH>水曜日</TH> </TR>
<TR> <TD>1限</TD> <TD>数学A</TD> <TD> </TD> <TD> </TD> </TR>
<TR> <TD>2限</TD> <TD> </TD> <TD>ゼミ</TD> <TD> </TD> </TR>
<TR> <TD>3限</TD> <TD>数学B</TD> <TD>ゼミ</TD> <TD>法学</TD> </TR>
<TR> <TD>4限</TD> <TD>経済原論</TD> <TD> </TD> <TD>歴史学</TD> </TR>
<TR> <TD>5限</TD> <TD> </TD> <TD> </TD> <TD>英語</TD></TR>
<CAPTION>中央太郎の時間割</CAPTION>
</TABLE>
ここで、授業科目名以外に担当者あるいは部屋を入れるにはどうしたらよいでしょう。 あるいは1限、2限の下に授業時間を書いておきたいときはどうすればよいでしょうか。このためにはつぎに 述べるようなテクニックが必要になります。
表を入れ子にする
これは表の中に表を入れたいときに使います。 今の場合,たとえば数学Aの下に小林その下に教室を7401のようにいれたいとします。 そのときには数学Aを次のようにひとつの表
<TABLE BORDER=0>
<TR><TD>数学A</TD></TR>
<TR><TD>小林</TD></TR>
<TR><TD>7401</TD></TR>
</TABLE>
でおきかえます。置き換えた結果は次のようになります。
時間/曜日 | 月曜日 | 火曜日 | 水曜日 | |||
---|---|---|---|---|---|---|
1限 |
|
|||||
2限 | ゼミ | |||||
3限 | 数学B | ゼミ | 法学 | |||
4限 | 経済原論 | 歴史学 | ||||
5限 | 英語 |
これのソースを次に書きました。前と比較してください。
<CENTER>
<TABLE BORDER="10">
<TR> <TH>時間/曜日 </TH> <TH>月曜日</TH> <TH>火曜日</TH> <TH>水曜日</TH> </TR>
<TR> <TD>1限</TD>
<TD>
<TABLE BORDER=0>
<TR><TD>数学A</TD></TR>
<TR><TD>小林</TD></TR>
<TR><TD>7401</TD></TR>
</TABLE>
</TD>
<TD> </TD> <TD> </TD> </TR>
<TR> <TD>2限</TD> <TD> </TD> <TD>ゼミ</TD> <TD> </TD> </TR>
<TR> <TD>3限</TD> <TD>数学B</TD> <TD>ゼミ</TD> <TD>法学</TD> </TR>
<TR> <TD>4限</TD> <TD>経済原論</TD> <TD> </TD> <TD>歴史学</TD> </TR>
<TR> <TD>5限</TD> <TD> </TD> <TD> </TD> <TD>英語</TD></TR>
<CAPTION>中央太郎の時間割</CAPTION>
</TABLE>
</CENTER>
ここで注意することとしては入れ子にする表には枠をつけません。そのため、BORDER=0 としてあります。 同じ考えで、1限の下に時間を入れてみます。次のようになります。
時間/曜日 | 月曜日 | 火曜日 | 水曜日 | |||||
---|---|---|---|---|---|---|---|---|
|
|
|||||||
2限 | ゼミ | |||||||
3限 | 数学B | ゼミ | 法学 | |||||
4限 | 経済原論 | 歴史学 | ||||||
5限 | 英語 |
これを応用すれば、時間割ができます。枠を変えたりして、各自の時間割を考えてください。 ここで、うえのソースは次のようになります。
<CENTER>
<TABLE BORDER="10">
<TR> <TH>時間/曜日 </TH> <TH>月曜日</TH> <TH>火曜日</TH> <TH>水曜日</TH> </TR>
<TR>
<TD>
<TABLE BORDER="0">
<TR><TD>1限</TD></TR>
<TR><TD>9:20-10:50</TD></TR>
</TABLE>
</TD>
<TD>
<TABLE BORDER=0>
<TR><TD>数学A</TD></TR>
<TR><TD>小林</TD></TR>
<TR><TD>7401</TD></TR>
</TABLE>
</TD>
<TD> </TD> <TD> </TD> </TR>
<TR> <TD>2限</TD> <TD> </TD> <TD>ゼミ</TD> <TD> </TD> </TR>
<TR> <TD>3限</TD> <TD>数学B</TD> <TD>ゼミ</TD> <TD>法学</TD> </TR>
<TR> <TD>4限</TD> <TD>経済原論</TD> <TD> </TD> <TD>歴史学</TD> </TR>
<TR> <TD>5限</TD> <TD> </TD> <TD> </TD> <TD>英語</TD></TR>
<CAPTION>中央太郎の時間割</CAPTION>
</TABLE>
</CENTER>
表の枠の色を指定する
枠の色を変えるときには次のようにします。
< TABLE BORDER="10"BORDERCOLOR="#FF00FF"> 〜</TABLE>
次のようになります。
時間/曜日 | 月曜日 | 火曜日 | 水曜日 |
---|---|---|---|
1限 | 数学A | ||
2限 | ゼミ | ||
3限 | 数学B | ゼミ | 法学 |
4限 | 経済原論 | 歴史学 | |
5限 | 英語 |
表全体の背景の色を変える。このためにはTABLEタグのなかに指定をします。
<TABLE BORDER="10"BGCOLOR="yellow"> 〜</TABLE>
表の一行の背景の色を変える。このためにはTRタグの中に指定をします。
<TR BGCOLOR="yellow"> 〜</TR>
セルの背景の色を変える。このときはTDタグあるいはTHタグの中に指定をします。
<TD BGCOLOR="yellow"> 〜</TD>
<TH BGCOLOR="yellow"> 〜</TH>
これらの指定をすると次のようになります。
時間/曜日 | 月曜日 | 火曜日 | 水曜日 |
---|---|---|---|
1限 | 数学A | ||
2限 | ゼミ | ||
3限 | 数学B | ゼミ | 法学 |
4限 | 経済原論 | 歴史学 | |
5限 | 英語 |
表の背景に画像を張り込む
表全体の背景画像を変える。
<TABLE BORDER="10"BACKGROUND="flower1.jpg"> 〜</TABLE>
表の一行の背景画像を変える。
<TR BACKGROUND="flower1.jpg"> 〜</TR>
セルの背景画像を変える
<TD BACKGROUND="flower1.jpg"> 〜</TD>
<TH BACKGROUND="flower1.jpg"> 〜</TH>
時間割に画像をはり込んでみました。
時間/曜日 | 月曜日 | 火曜日 | 水曜日 | |||
---|---|---|---|---|---|---|
1限 |
|
|||||
2限 | ゼミ | |||||
3限 | 数学B | ゼミ | 法学 | |||
4限 | 経済原論 | 歴史学 | ||||
5限 | 英語 |
時間/曜日 | 月曜日 | 火曜日 | 水曜日 | |||||
---|---|---|---|---|---|---|---|---|
|
|
|||||||
2限 | ゼミ | |||||||
3限 | 数学B | ゼミ | 法学 | |||||
4限 | 経済原論 | 歴史学 | ||||||
5限 | 英語 |
セル内の文字の横方向の表示位置を指定する
次のように書きます。
<TH ALIGN="left">経済原論</TH>
<TD ALIGN="left">経済原論</TD>
ここで、leftはcenterあるいはrightとすることができます。 left, center, rightはそれぞれ左寄せ、中央ぞろえ、右寄せをあらわします。 次の例でこの効果を確認します。この例ではセルの幅を大きめに取り、様子を確認します。 このために、TABLEタグにWIDTH="360"と幅を指定しています。
場所/月 | 東京 | 札幌 | 仙台 |
---|---|---|---|
1月 | 5.0 | -3.1 | -1.1 |
2月 | 6.5 | -2.2 | -0.5 |
3月 | 8.5 | 3.5 | 4.5 |
4月 | 12.7 | 6.5 | 7.5 |
5月 | 18.3 | 10.5 | 12.7 |
<CENTER>
<TABLE BORDER="10" WIDTH="360">
<TR><TH>場所/月</TH><TH>東京</TH><TH>札幌</TH><TH>仙台</TH></TR>
<TR> <TD ALIGN="left">1月</TD>
<TD ALIGN="center"> 5.0</TD>
<TD ALIGN="right">-3.1</TD> <TD>-1.1</TD> </TR>
<TR><TD ALIGN="center"2月</TD>
<TD ALIGN="center"> 6.5</TD>
<TD ALIGN="right">-2.2</TD><TD>-0.5</TD></TR>
<TR><TD ALIGN="right"3月</TD>
<TD ALIGN="center"> 8.5</TD>
<TD ALIGN="right">3.5</TD><TD>4.5</TD></TR>
<TR><TD ALIGN="center">4月</TD>
<TD ALIGN="center">12.7</TD>
<TD ALIGN="right">6.5</TD> <TD>7.5</TD></TR>
<TR><TD ALIGN="left">5月</TD>
<TD ALIGN="center">18.3</TD
<TD ALIGN="right">10.5</TD><TD>12.7</TD></TR>
<CAPTION>日本の気温</CAPTION></TABLE>
</CENTER>
セル内の文字の縦方向の表示位置を指定する
次のように書きます。
<TH VALIGN="top">経済原論</TH>
<TD VALIGN="top">経済原論</TD>
ここで、topはmiddleあるいはbottomとすることができます。 top, middle, bottomはそれぞれ上に配置、中央に配置、下に配置をあらわします。 次の例でこの効果を確認します。この例ではセルの高さを大きめに取り、様子を確認します。 このために、TABLEタグにHEIGHT="320"と高さを指定しています。
場所/月 | 東京 | 札幌 | 仙台 |
---|---|---|---|
1月 | 5.0 | -3.1 | -1.1 |
2月 | 6.5 | -2.2 | -0.5 |
3月 | 8.5 | 3.5 | 4.5 |
4月 | 12.7 | 6.5 | 7.5 |
5月 | 18.3 | 10.5 | 12.7 |
念のためにソースを書いておきます。
<CENTER>
<TABLE BORDER="10" HEIGHT="320">
<TR> <TH VALIGN="bottom">場所/月 </TH> <TH VALIGN="bottom">東京</TH> <TH VALIGN="bottom">札幌</TH> <TH VALIGN="bottom">仙台</TH> </TR>
<TR> <TD VALIGN="top">1月</TD> <TD> 5.0</TD> <TD>-3.1</TD> <TD>-1.1</TD> </TR>
<TR> <TD VALIGN="top">2月</TD> <TD> 6.5</TD> <TD>-2.2</TD> <TD>-0.5</TD> </TR>
<TR> <TD VALIGN="top">3月</TD> <TD> 8.5</TD> <TD>3.5</TD> <TD>4.5</TD> </TR>
<TR> <TD VALIGN="top">4月</TD> <TD>12.7</TD> <TD>6.5</TD> <TD>7.5</TD> </TR>
<TR> <TD VALIGN="top">5月</TD> <TD>18.3</TD> <TD>10.5</TD> <TD>12.7</TD> </TR>
<CAPTION>日本の気温</CAPTION> </TABLE>
</CENTER>
戻る
セルとセルの間隔を指定するには
<TABLE CELLSPACING="10"> 〜</TABLE>
と書きます。セル内の余白を指定するには
<TABLE CELLPADDING="5"> 〜</TABLE>
とかきます。次に例をあげます。
場所/月 | 東京 | 札幌 | 仙台 |
---|---|---|---|
1月 | 5.0 | -3.1 | -1.1 |
2月 | 6.5 | -2.2 | -0.5 |
3月 | 8.5 | 3.5 | 4.5 |
4月 | 12.7 | 6.5 | 7.5 |
5月 | 18.3 | 10.5 | 12.7 |
場所/月 | 東京 | 札幌 | 仙台 |
---|---|---|---|
1月 | 5.0 | -3.1 | -1.1 |
2月 | 6.5 | -2.2 | -0.5 |
3月 | 8.5 | 3.5 | 4.5 |
4月 | 12.7 | 6.5 | 7.5 |
5月 | 18.3 | 10.5 | 12.7 |
ソースは次のようになります。
<CENTER>
<TABLE BORDER="10" CELLSPACING="10" CELLPADDING="5">
<TR> <TH>場所/月 </TH> <TH>東京</TH> <TH>札幌</TH> <TH>仙台</TH> </TR>
<TR> <TD>1月</TD> <TD> 5.0</TD> <TD>-3.1</TD> <TD>-1.1</TD> </TR>
<TR> <TD>2月</TD> <TD> 6.5</TD> <TD>-2.2</TD> <TD>-0.5</TD> </TR>
<TR> <TD>3月</TD> <TD> 8.5</TD> <TD>3.5</TD> <TD>4.5</TD> </TR>
<TR> <TD>4月</TD> <TD>12.7</TD> <TD>6.5</TD> <TD>7.5</TD> </TR>
<TR> <TD>5月</TD> <TD>18.3</TD> <TD>10.5</TD> <TD>12.7</TD> </TR>
<CAPTION>日本の気温</CAPTION> </TABLE>
</CENTER>
戻る
セルを縦方向にいくつかのセルを一つに用いたいことがあります。
たとえば、東京の1月と2月の気温を一つのセルであらわす場合です。
このような場合には<TH ROWSPAN=2> ... </TH>
あるいは<TD ROWSPAN=3> ... </TD>
のようにします。
これは縦方向に2つのセルをひとつに使ったり、3つをひとつに使ったりします。
次の例を参考にしてください。
これを用いると下の行のセルをひとつ使ってしまうので
それを考えて配列をしなければなりません。
<TABLE BORDER=10>
<TR> <TH>場所/月 </TH><TH>東京</TH> <TH>札幌</TH> </TR>
<TR> <TD>1月</TD> <TD ROWSPAN=2> 5.0</TD> <TD>-3.1</TD> </TR>
<TR> <TD>2月</TD> <TD>-2.2</TD> </TR>
<TR> <TD>3月</TD> <TD> 8.5</TD> <TD ROWSPAN=3>6.5</TD> </TR>
<TR> <TD>4月</TD> <TD>12.7</TD> </TR>
<TR> <TD>5月</TD> <TD>18.3</TD> </TR>
<CAPTION>日本の気温</CAPTION>
</TABLE>
これはブラウザでは次のように見えます。
場所/月 | 東京 | 札幌 |
---|---|---|
1月 | 5.0 | -3.1 |
2月 | -2.2 | |
3月 | 8.5 | 6.5 |
4月 | 12.7 | |
5月 | 18.3 |
横のデータ行などでいくつかのセルを一つに使いたいときには
<TH COLSPAN=2> ... </TH>あるいは<TD COLSPAN=3> ... </TD>
のようにします。このとき、横のセルの数はどの行でもおなじになるように
してください。例を示します。
<TABLE BORDER=10>
<TR> <TH>場所/月 </TH> <TH>東京</TH> <TH>札幌</TH> <TH>仙台</TH> </TR>
<TR> <TD>1月</TD> <TD> 5.0</TD> <TD COLSPAN=2>データなし</TD> </TR>
<TR> <TD>2月</TD> <TD> 6.5</TD> <TD>-2.2</TD> <TD>-0.5</TD> </TR>
<TR> <TD>3月</TD> <TD> 8.5</TD> <TD>3.5</TD> <TD>4.5</TD> </TR>
<TR> <TD>4月</TD> <TD COLSPAN=3 align=center>データ不明</TD> </TR>
<TR> <TD>5月</TD> <TD>18.3</TD> <TD>10.5</TD> <TD>12.7</TD> </TR>
<CAPTION>日本の気温</CAPTION>
</TABLE>
これはブラウザでは次のように見えます。
場所/月 | 東京 | 札幌 | 仙台 |
---|---|---|---|
1月 | 5.0 | データなし | |
2月 | 6.5 | -2.2 | -0.5 |
3月 | 8.5 | 3.5 | 4.5 |
4月 | データ不明 | ||
5月 | 18.3 | 10.5 | 12.7 |
これらをあわせて用いることもできる。次の例を参照のこと。
<TABLE BORDER=3>
<TR> <TH>場所/月</TH> <TH>東京</TH> <TH>札幌</TH> <TH>仙台</TH> </TR>
<TR> <TD>1月</TD> <TD> 5.0</TD><TD COLSPAN=2 ROWSPAN=2>データなし</TD></TR>
<TR> <TD>2月</TD> <TD> 6.5</TD> </TR>
<TR> <TD>3月</TD> <TD> 8.5</TD> <TD>3.5</TD> <TD>4.5</TD> </TR>
<TR> <TD>4月</TD> <TD COLSPAN=3 align=center>データ不明</TD> </TR>
<TR> <TD>5月</TD> <TD>18.3</TD> <TD>10.5</TD> <TD>12.7</TD> </TR>
<CAPTION>日本の気温</CAPTION>
</TABLE>
これはブラウザでは次のように見えます。
場所/月 | 東京 | 札幌 | 仙台 |
---|---|---|---|
1月 | 5.0 | データなし | |
2月 | 6.5 | ||
3月 | 8.5 | 3.5 | 4.5 |
4月 | データ不明 | ||
5月 | 18.3 | 10.5 | 12.7 |
フレーム機能は1つのページをいくつかの
長方形に分割してそのおのおのに
書類を表示させる機能です。
各長方形はフレームセルといわれ、これは独立してウィンドウです。
スクロールをしたりすることができます。
いくつかの書類を参照しながら作業をするときに便利です。
各フレームセルには名前が与えられ、そのフレームにリンクをすることができます。
例を示します。
簡単な例 画面を縦に2分割してそれぞれにファイルmenu.htmlとhtmltxt.htmlを表示します。
その分割比は20%, 80%とします。これはあわせて100%であればいくつでもかまいません。
この場合には次のようになります。
<FRAMESET COLS="20%,80%">
ここで、フレームを記述するファイルは新しく作成して、index1.htmlとします。
そこでつぎのようになります。
同様に横方向の分割も作れます。次の例を参考にしてください。
<FRAMESET ROWS="30%,70%">
ここで、フレームを記述するファイルは新しく作成して、index2.htmlとします。
そこでつぎのようになります。
今度は縦横同時に分割してみます。これはつぎのようになります。
各自で解読して見てください。
<FRAMESET COLS="50%,50%">
ここで<FRAMESET COLS="50%,50%">は横の方向を分割します。左の方向の分割割合は
50%,50%です。この割合はあわせて100%であるようにすれば自由です。
このタグは</FRAMESET>でしめます。
<FRAMESET ROWS="30%,70%">
の部分では左側の縦のウィンドウを30%と70%に分割しています。
それぞれのウィンドウにmypage1.html, mypage2.htmlの文書を表示しています。
これらの文書は実際存在しているものでなければなりません。
また、それぞれのウィンドウには名前がつけられます。
たとえばNAME="window3"の部分がそうです。これは後で参照をするときにもちいます。
各ウィンドウには自動的にスクロールバーがつきます。
ここで
<FRAMESET ROWS="30%,30%,40%">
では右側を上から30%,30%,40%に分割して、それぞれに文書を表示しています。
注意することとして、FRAMESET タグはBODY タグと一緒に用いることはできません。
いっしょに用いるとFRAMESETタグは無視されます。
<a href="manual.html" TARGET="WINDOW3">解説</a>
<HEAD>
今までのことを応用してよく見かけるウィンドウを表示しましょう。
すなわちウィンドウを二つに分割して左側に縦長のウィンドウを作りそこに
目次を表示し、それをクリックすると右側のウィンドウにその説明を表示するというものです。
そのためには全体の枠組みを設定するページindex.html, 2分割された各ウィンドウに表示する
文書を2つmenu.html, htmltxt.html準備します。
基本的な考え方はmenu.htmlのなかからリンクを張る文書を作成しておき、それを
分割された他のウィンドウに表示します。
具体的には次のようにするとよいでしょう。
まず、index.htmlの中では
を記述します。menu.html のなかにはframe2ウインドウに表示される項目一覧がかかれます。
たとえばmenu.htmlは次のようにします。
<A HREF="spring.html" TARGET="frame2">春</A><P>
<FRAME SRC="menu.html" NAME="window3">
<FRAME SRC="htmltxt.html" NAME="window4">
</FRAMESET>
<FRAME SRC="menu.html" NAME="window3">
<FRAME SRC="htmltxt.html" NAME="window4">
</FRAMESET>
<FRAMESET ROWS="30%,70%">
<FRAME SRC="mypage1.html" NAME="window3">
<FRAME SRC="mypage2.html" NAME="window4">
</FRAMESET>
<FRAMESET ROWS="30%,30%,40%">
<FRAME SRC="mypage3.html" NAME="window5">
<FRAME SRC="htmltxt1.html" NAME="window6">
<FRAME SRC="htmltxt2.html" NAME="window7">
</FRAMESET>
</FRAMESET>
横に分割されたそれぞれのウィンドウをさらに縦方向にいくつかに分割します。
<FRAME SRC="mypage1.html">
<FRAME SRC="mypage2.html">
</FRAMESET>
<FRAME SRC="mypage3.html" NAME="window5">
<FRAME SRC="htmltxt1.html" NAME="window6">
<FRAME SRC="htmltxt2.html" NAME="window7">
</FRAMESET>
次のように見えます。
ここをクリックしてください
ターゲットウインドウ
この機能を用いることにより、既存の書類と見比べてほしいときや実行結果を
表示するときに用いると便利です。
ハイパーリンクのときの例を示します。
この例では"解説"をクリックするとmanual.htmlを表示するのですが、
その時現在のホームページのウィンドウに表示しないで別のウィンドウを
作成してそこに表示します。TARGET="WINDOW1"
で表示するウィンドウを指定します。WINDOW3はあらかじめ作成しておきます。
たとえば、フレームを参照。
ハイパーリンクを常に別のウィンドウに表示したいときは
HEADの中につぎのようにBASEタグを用いて書きます。その時は上のようにいちいち書く必要は
ありません。
<TITLE> MY HOME PAGE</TITLE>
<BASE TARGET="WINDOW3">
</HEAD>
<FRAMESET COLS="30%,70%">
<FRAME SRC="menu.html" NAME="frame1">
<FRAME SRC="htmltxt.html" NAME="frame2">
</FRAMESET>
<A HREF="summer.html" TARGET="frame2">夏</A><P>
<A HREF="autumn.html" TARGET="frame2">秋</A><P>
<A HREF="winter.html" TARGET="frame2">冬</A><P>
この時、4つの文書spring.html, summer.html, autumn.html, winter.htmlは
あらかじめ作成しておきます。それはそれぞれ春、夏、秋、冬に対応する
文書です。それはすべてframe2のウィンドウに表示されます。
これを応用すると簡単な辞書あるいはスケジュール表あるいは
部署をクリックするとその予定が表示されるような
ものができる。
戻る