リンクを貼る

上部
次は、HTMLでリンクを貼る方法を説明しよう。
リンクを貼るにはaタグを使うんだよ。

上部
HTMLでの記載は次のようになるよ。

<a href="ここにリンク先のURLを書きます">ここにリンクする文字を書きます</a>


URLって何ですか?

上部
URLとは、インターネット上でのホームページの住所のようなものだよ。
具体的にはブラウザのアドレスバーに表示されているのがURLになるよ。

例えば、学君がよく見ている Yahoo! JAPAN のURLは「http://www.yahoo.co.jp/」 になるんだよ。
Yahoo! JAPANにリンクを貼りたい場合、HTMLは次のようになるよ。

<a href="http://www.yahoo.co.jp/">Yahoo! JAPAN</a>

リンクを新しいウィンドウで開きたい場合は次のように記載しよう

<a href="http://www.yahoo.co.jp/" target="_blank">Yahoo! JAPAN</a>


なるほど〜。わかりました!
僕の自己紹介にもおすすめのホームページへのリンクを追加してみますね。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<title>学の自己紹介</title>
</head>
<body>
<h1>学の自己紹介</h1>
<h2>名前</h2>
<p>名前は学(まなぶ)ですが勉強は苦手です。</p>
<h2>性格</h2>
<p>元気がとりえです。<br>
ちょっとおっちょこちょいで小さな失敗をすることがあります。</p>
<h2>趣味</h2>
<p>趣味はサッカーと映画です。</p>
<h3>サッカー</h3>
<p>週末には草サッカーをやっています。</p>
<h3>映画</h3>
<p>好きな映画のジャンル</p>
<ul>
<li>アクション映画
<li>ホラー映画
</ul>
<h2>おすすめホームページ</h2>
<p>僕のおすすめのホームページは<a href="http://www.nikkansports.com/">日刊スポーツ</a>です。</p>

<table border="1" cellspacing="0" cellpadding="5">
<caption>「学の年表」</caption>
<tr><th>年齢</th><th>内容</th></tr>
<tr><td>0歳</td><td>誕生</td></tr>
<tr><td>6歳</td><td>小学校入学。給食大好き。</td></tr>
<tr><td>12歳</td><td>中学校入学。お弁当大好き。</td></tr>
</table>
</body>
</html>

上部
では、ここまでを表示してみよう!

学の自己紹介を新しいウィンドウで開く


おおー、ちゃんとおすすめのホームページへのリンクが追加されましたよ!

SEO [PR] 爆速!無料ブログ 無料ホームページ開設 無料ライブ放送