サラリーマンの副業@サラリーマンの副業ポータルサイト-へそくりできるかなHTML基本技術編 > HTML-リンクの作成

HTML-リンクの作成

リンクを利用することにより、ブラウザに別のホームページを
表示させたりすることが出来ます。


先程作成した「index.html」←→「profile.html」へと相互に表示を切り替える
(ジャンプする)リンクを作成してみましょう。


index.htmlの変更 (リンクの作成)

「profile.gif」「top.gif」の2種類の画像は、
下の画像を右クリック して【名前を付けて画像を保存】から取得してください



<HTML>
<HEAD>
<TITLE>ホームページの練習</TITLE>
</HEAD>
<BODY BACKGROUND="back.gif">
<CENTER>
<FONT SIZE="7">
<B>私の<I>ホームページ</I>にようこそ!
</FONT></B><BR>
<BR>
<IMG SRC="picture.gif">
<BR><BR>
<FONT COLOR="BLUE">これから色々作成していきます。
ごゆっくりどうぞ</FONT>
<BR><BR><BR><BR>
<A HREF="profile.html">
<IMG SRC="profile.gif" BORDER="0"></A>
<BR><BR>

<IMG SRC="welcome.gif">
</CENTER>
</BODY>
</HTML>


profile.htmlの変更 (リンクの作成)


<HTML>
<HEAD>
<TITLE>ホームページの練習</TITLE>
</HEAD>
<BODY BGCOLOR="moccasin">
<CENTER>
<FONT SIZE="7" COLOR="blueviolet">
<B>私のプロフィール</B></FONT>
<BR><BR>
<TABLE BORDER="1">
<TR>
<TD>自己紹介</TD>
</TR>
<TR>
<TD>名前</TD>
<TD>5年は寝たろう</TD>
</TR>
<TR>
<TD>年齢</TD>
<TD>ほどよく中年</TD>
</TR>
<TR>
<TD>趣味</TD>
<TD>食べ歩き・飲み歩き</TD>
</TR>
<TR>
<TD>特技</TD>
<TD>死んだふり</TD>
</TR>
</TABLE>
<BR><BR><BR><BR>
<A HREF="index.html">
<IMG SRC="top.gif" BORDER="0"></A>
<BR></BR>

</CENTER>
</BODY>
</HTML>

リンクさせる時にはどうすれば良いの?


項目をリンクさせるには、
<A HREF="リンク先">~</A>
タグを使用します。


リンク先にはリンクする先のファイル名を、"~"の部分には
リンクさせる項目を指定します。

リンクさせる項目は、文字でも画像でも構いません。
上の例では、「profile」という画像(gifファイル)と「TOP」という画像
(gifファイル)を指定しています。


投稿者 hana : 2006年02月10日 17:23

 

当サイトで紹介している情報への登録などは、内容を自分自身でご確認のうえ、実施して頂くようお願い致します。
当サイトに掲載している情報を利用し、いかなる被害や損害があっても当サイトは一切の責任を負いません。

© 2003~ サラリーマンの副業@サラリーマンの副業ポータルサイト-へそくりできるかなAll Rights Reserved.