HTML / XHTML入門〜リンクの指定

カスタム検索

サイトマップ

トップページ

HTML/XHTML

HTML / XHTML入門

リンクの指定

他のWebページへリンクする方法を説明します。まず、2つのHTMLファイルを作っておきます。

ここでは説明のためにsample1.htmlというファイル名で保存します。

sample1.html


<html>
    <head>
        <title>サンプル1</title>
    </head>
    <body>
        <h1>サンプル1</h1>
        <p>これは、sample1.htmlファイルです。
        </p>
    </body>
</html>

もう一方は、sample2.htmlというファイル名で保存します。

sample2.html


<html>
    <head>
        <title>サンプル2</title>
    </head>
    <body>
        <h1>サンプル2</h1>
        <p>これは、sample2.htmlファイルです。
        </p>
    </body>
</html>

作成した2つのHTMLファイルは、同じディレクトリ（フォルダ）に保存しておきます。

作成したHTMLファイルは、同じディレクトリ（フォルダ）に保存します。名前は「sample1.html」と「sample2.html」にしました。

<a>タグ

他のWebページにリンクするには、<a>タグを使用します。先ほど作成したsample1.htmlに下の入力例のように追加します。

開始タグである<a>の中で、「a」の後にスペースで区切って、「href="sample2.html"」とありますが、そのまま入力してください（この部分については次ページで説明します）。

sample1a.html


<html>
    <head>
        <title>サンプル1</title>
    </head>
    <body>
        <h1>サンプル1</h1>
        <p>これは、sample1a.htmlファイルです。
        </p>
        <p><a href="sample2.html">sample2.html</a>へリンク
        </p>
    </body>
</html>

<a>タグでリンクを指定すると、多くのブラウザでは青い文字色でアンダーラインをつけて表示します。その青い文字色の部分をクリックすると、sample2.htmlファイルがブラウザに読み込まれ（開かれ）ることになります。

<a>は「Anchor」（アンカー：船のいかりの意味）の頭文字を取っています。<a>要素を基点として、他のファイルを読み込むという感覚です。

まとめ

<a>タグでリンクを指定

リスト形式

ページの先頭

タグの属性

2024 Webデザインレッスンプライバシーポリシーサイト管理者に連絡