HTML - リンク

■ページ目次

リンクの基本
リンク
リンク文字の装飾

■リンクの基本

■リンク

 <a href="uri">内容</a> ... "uri", "#name", "url#name", "mailto:emailアドレス"  

 <a name="名前">必要に応じて文字列</a>

■例題

リンクの例です。(link01.html)


 <!-- link01.html -->
 <html>
 <head>
 <title>わたしのホーム･ページ</title>
 <meta http-equiv="Content-type" content="text/html; charset=Shift_JIS"/>
 </head>
 <body>
 <h1>わたしのホーム･ページ</h1>
 <h2>ホイップ</h2>
 <p>
     女の子で、誕生日は12月14日です。<br/>
 </p>
 <p>
     さて、この子は何犬でしょう? ... 
         <a href="#ans">こたえ</a><br/>
 </p>
 <p>
     みぎの写真をクリックしてください。
         <a href="http://csx.jp/~marunomaruno/">
             <img src="pic_0036.jpg" alt="ホイップ"/>
         </a>
 </p>
 <br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
 <br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
 <p>
     <a name="ans">ボクサー</a>
 </p>
 <a href="mailto:marunomarunola@yahoo.co.jp">メールください</a>
 </body>
 </html>

□ 実行結果

Top

■リンク文字の装飾


 <body bgcolor="背景色" 
       text="標準文字色"
       link="リンク文字色"
       alink="リンクのクリック時の文字色"
       vlink="リンク選択後の文字色">
 　　ページの内容
 </body>

■例題

bodyタグを指定した例です。(body01.html)


 <!-- body01.html -->
 <html>
 <head>
 <title>わたしのホーム･ページ</title>
 <meta http-equiv="Content-type" content="text/html; charset=Shift_JIS"/>
 </head>
 <body bgcolor="silver" text="white" link="" alink="red" vlink="green">
 わたしのホーム･ページ
 <br/>
 <a href="title01.html">リンクの色は青</a>
 <br/>
 <a href="comment01.html">リンク中の色は赤</a>
 <br/>
 <a href="meta01.html">リンク後の色は緑</a>
 </body>
 </html>

□ 実行結果

Top