簡単なホームページの作り方　第６回

６、表組、リンクの仕方について（見栄えのする表と全世界と繋がるリンク）

（１）簡単な表組について

　まずは表組に入るテキスト全体を<TABLE>と</TABLE>ではさみます。
　枠線を表示する場合は、BORDERオプションを付けます。
　例えば、下のデータを表組にする方法をみてみます。

団体名　　尾西商工会
所在地　　一宮市小信中島字川南３６
電話　　　０５８６－６２－９１１１
設立　　　昭和３９年６月１１日

これを表組にすると下のようになります。(書式は第５回を参照）及び下記の書式参照

団体名	尾西商工会
所在地	一宮市小信中島字川南３６
電話	０５８６－６２－９１１１
設立	昭和３９年６月１１日

見栄えがよくなりますね。

実際にHOTALLなどで表組を行うには、まず縦・横の升目を作っておいてから、その升目に
文字を入力して、さらにその後、文字の大きさや色などを指定して作って行きます。

（２）文字を表の右側へ回り込ませよう
　　(書式は､　<TABLE ALIGN=LEFT>です。この表のソース又は第５回参照）　

団体名	尾西商工会
所在地	一宮市小信中島字川南３６
電話	０５８６－６２－９１１１
設立	昭和３９年６月１１日

＝＝＝＝事業活動＝＝＝＝
金融/税務/経営/経理/労働/取引/その他
各種共済や保険等について、いつでも経営
指導員等が皆様のご相談に応じています。
お気軽にご来館ください。

（３）表の大きさ

団体名	尾西商工会
所在地	一宮市小信中島字川南３６
電話	０５８６－６２－９１１１

表の大きさを変える方法は、幅の指定では、WIDTH=n% 高さの指定では、HEIGHT=n%　
のオプションを下記のようにつけます。（タグ・オプション一覧参照）

 　<TABLE  BORDER  WIDTH = 80%  HEIGHT = 20%>

　(この例では、幅80％　高さ20％　です。ここで、％は画面に対しての大きさです）

（４）行列をまたぐより複雑な表の作成及びリンクの仕方

団体名

問い合わせ先

住　所

電話（ＦＡＸ）

愛知県商工会
連合会
〒４６０－０００２
名古屋市中区丸の内３－１－６
（産業貿易館西館に移転しました） ０５２－５８２－３９３５

（０５２－５８３－８４０１）

尾西商工会
〒４９４－０００７
一宮市小信中島字川南３６
０５８６－６２－９１１１

（０５８６－６２－９１１２）

（　２列をまたぐセルは、ＣＯＬＳＰＡＮ＝ｎ　２行をまたぐセルは、ＲＯＷＳＰＡＮ＝ｎ　等の
　オプションをつかいます）

　また、（団体名、住所など）は、表組の中でセンタリングの指定をしています。
　センタリング、表組などの書式は、以下のとおりです。

団体名	問い合わせ先
住　所	電話（ＦＡＸ）
愛知県商工会連合会	〒４６０－０００２名古屋市中区丸の内３－１－６（産業貿易館西館に移転しました）	０５２－５８２－３９３５
（０５２－５８３－８４０１）
尾西商工会	〒４９４－０００７一宮市小信中島字川南３６	０５８６－６２－９１１１
（０５８６－６２－９１１２）

<TABLE BORDER>　　･･･････････････････････････表組を作る（枠線を表示）
<TR>　　　　････････････････････････････････････　表組の行を定義する
<TD ROWSPAN=2> 　････････････････････････　２行をまたぐセルを作る
<BR>　　　　　　　　　　･･････････････････････････改行
<CENTER><FONT SIZE=4><B>団体名</B></FONT></CENTER><BR>
</TD>
<TD COLSPAN=2>　　････････････････････････　２列をまたぐセルを作る
<CENTER><B>問い合わせ先</B></CENTER><BR>　･･･････････センタリング指定
</TD>
</TR>　　　･･････････････････････････表組の行を定義する（この行の定義終了）

ここで、上の表と下の書式の対応を見比べてください。

<TR><TD><CENTER><B>住　所</B></CENTER><BR></TD>
<TD><CENTER><B>電話 （ＦＡＸ）</B></CENTER><BR></TD></TR>
<TR><TD ROWSPAN=2>
<FONT SIZE=4><B>
<A HREF="http://www.xxxyyy.or.jp/">愛知県商工会</A></B></FONT><BR>
<FONT SIZE=4><B>
<A HREF="http://www.xxxyyy.or.jp/">連合会</A></B></FONT><BR></TD>
<TD ROWSPAN=2><B>〒４５０－０００２</B><BR>
<FONT SIZE=4><B>名古屋市中村区名駅４－４－３９</B></FONT><BR></TD>
<TD><B>０５２－５８２－３９３５</B><BR></TD></TR>

　　　　　　　･･･････････････････････････　

リンクの仕方について

　ここで、表の中の団体名のホームページにリンクを張るには、ＨＯＴＡＬＬの場合、リンク
　したい団体の名前などをマウスで指定してから書式に従ってハイパーリンクを施します。

　（上の例では、例えば「尾西市商工会」をクリックすれば、「光の時代」の中の
　　kmham211/bisaisi2.htm　即ち「尾西市商工会」へ飛ぶことができます。

　　書式は、以下のとおりです。

　<A HREF="http://www.xxxyyy.or.jp/">愛知県商工会</A>　･･････ホットリンクの指定
　<A HREF="bisaisi.htm">尾西市商工会</A>

（このように、<A>と</A>で囲んでジャンプさせる機能をホットリンクと言います。）
（タグ・オプション一覧参照）

　上の例は、グローバルリンクと言って愛知県商工会連合会のホームページにリンクしており、
　下の例は、同じディレクトリにある「bisaisi.htm」というファイルにリンクしています。
　 このように、リンクは、必要な情報やデーターなどを他のホームページと関連づけるもので
　 あり、またこれによって全世界のホームページとつなぐことができるため、ホームページの
　一番大きな魅力といえます。
　（自薦Ｍｙリンク集にはいろいろな関連するホームページの紹介があるので、参考にしてください。）
　また、下にある

トップへ戻るは、この画像と文字のどちらかがクリックされると、この
　ページのトップへジャンプすることができます。
　長い文章などの場合には、これを付けておくとトップに戻る場合に便利です。

　書式は、以下のとおりです。

（１）まずジャンプ先の箇所にラベル名（ここでは、<A NAME="roku">　を以下のように入れて
　　おきます。（下記の例は、このページのソースです）

　　<BODY BACKGROUND="gazou/back367.jpg">
　 <PRE><A NAME="roku"><FONT SIZE=6><B>簡単なホームページの作り方</B>
　 <B>第６回</B></FONT>
　　 <HR></PRE>
　　　･････････････････

　ここで、<A NAME="roku">は、リンク先に名前を付ける<A>タグのオプションです）

（２）リンク指定側では、以下の記述になります。

 <A HREF="#roku"><IMG SRC="gazou/mark375up.gif" ALT="">
 <FONT SIZE=4><B>トップへ戻る</A></B></FONT>


　つまり、ジャンプ先側に名前　<A NAME="名前=roku">を付け、リンク指定側に
　 <A HREF="#roku">トップへ戻る</A> を指定して、「トップへ戻る」をクリック
　すれば、トップに行くことができる次第です。

　リンクの項目を読み直す　･･････例えば、リンクの再読はここをクリックしてください。

　このように長い文章の途中に「名前」をいれておけば、あとからそこへジャンプすることが
　出来て、大変便利です。また、この講座のように本文と索引など相互に関連しあう項目の
　連結には、特に有効です。

　（付録のタグ一覧表と関連する講座のページの相互参照などを実際に見てください。）

以下、次回(第７回は、ここをクリックしてください。）

トップへ戻る

ホーム　　

タグ一覧表