ＨＴＭＬ基礎の基礎 後編
超簡単ＨＴＭＬ基礎

他のページへリンクをはって背景画像を入れれば、取り敢えず基本になるページの出来上がりです。このページは、ＨＴＭＬ基礎の基礎 前編の続きです。
■STEP1-5．リンクをはる
　いよいよ本格的になってきました。やっぱり、ホームページではリンクをはってこそ価値が出てくる？．．と思いませんか？
リンクをはるには、リンクしたい文字または画像を<A HREF="リンク先">・・・</A>で挟み込んでやるだけです。ここでは『アメリカンコッカースパニエル』の文字から、準備しておいた別のページにリンクをはってみました。他のＷｅｂサイトへリンクをはるには、"リンク先"に他サイトのＵＲＬを指定します。
<HTML>
<HEAD>
<TITLE>ＨＴＭＬサンプルページ５</TITLE>
</HEAD>
<BODY BGCOLOR="#FFFFFF">
<CENTER>
<H2>「ロン」のページへようこそ！</H2>
<FONT COLOR="red"><B>我が家の愛犬「ロン」です。</B></FONT><BR>
<HR>
<IMG SRC="image.jpg"><BR>
<BR>
<SMALL>
犬種：<A HREF="link.html">アメリカンコッカースパニエル</A><BR>
<FONT COLOR="deeppink">生年月：平成１０年１２月</FONT><BR>
<FONT COLOR="darkorange">好きな食べ物：ドッグフード</FONT><BR>
<FONT COLOR="green">将来の夢：りっぱな犬になること</FONT>
</SMALL>
</CENTER>
</BODY>
</HTML>

<A HREF="リンク先">
　　　　　　　....</A>
リンクをはります．
タグにはさまれた文字や画像
をクリックするとリンク先にジャ
ンプします．

【リンク先指定の例】
(1)リンク先の文書
　link.html
(2)他ホームページのＵＲＬ
　http://www....co.jp/
HTMLサンプルページ5 (sample05.html)
あらかじめ準備しておいた別ファイル"link.html"というページにリンクをはってみました。サンプルページで「アメリカンコッカースパニエル」の文字をクリックしてリンク先を確かめて見て下さい。

HomePage作成支援Top HomePage

■STEP1-6．背景画像を入れる
　最後の仕上げになりました。準備しておいた背景画像を入れて取り敢えず完成です。背景画像はフリー素材等を利用しても良いかも知れません。
背景画像や背景色を変えるだけでも、結構ページの印象が変わってきますので、色々と試してみましょう。
<HTML>
<HEAD>
<TITLE>ＨＴＭＬサンプルページ６</TITLE>
</HEAD>
<BODY BGCOLOR="#FFFFFF" BACKGROUND="back.gif">
<CENTER>
<H2>「ロン」のページへようこそ！</H2>
<FONT COLOR="red"><B>我が家の愛犬「ロン」です。</B></FONT><BR>
<HR>
<IMG SRC="image.jpg"><BR>
<BR>
<SMALL>
犬種：<A HREF="link.html">アメリカンコッカースパニエル</A><BR>
<FONT COLOR="deeppink">生年月：平成１０年１２月</FONT><BR>
<FONT COLOR="darkorange">好きな食べ物：ドッグフード</FONT><BR>
<FONT COLOR="green">将来の夢：りっぱな犬になること</FONT>
</SMALL>
</CENTER>
</BODY>
</HTML>


<BODY BACKGROUND=
　　　　　　"画像ファイル名">
で背景画像が表示されます．


back.gif



背景画像が読み込まれるまでは
BGCOLOR="色指定"で指定し
た背景色になります．
背景画像と似た色調の背景色を
指定しておくのがコツです．
HTMLサンプルページ6 (sample06.html)
"back.gif"という画像を背景に入れてみました。多少は楽しい雰囲気になったと思うのですが．．．？　とりあえず、このページは出来上がりです。

HomePage作成支援Top HomePage
Prev.
ＨＴＭＬ基礎の基礎 前編		 Next
テーブル基礎編
Copyright(C) 1999-2001 T.Kaze/Family Page Hiroshima