HTMLでの内部リンク
前のレッスンでは、ブラウザのアドレスバーからアドレスをコピーして、 他のサイトのページへのリンクを作成しました。 今度は、自分のサイトのページ同士をリンクで結びたいとしましょう。
この場合、アドレスバーからアドレスをコピーすることはできません。 その理由は、そのようなアドレスにはあなたのコンピューターのルートドライブから あなたのページへの完全なパスが含まれており、 別のフォルダに移動すると、そのようなリンクは単に壊れてしまうからです。
自サイトのページに対しては、別のアプローチを取るべきです。
例を使って学びましょう。
あなたのサイトのルートフォルダに index.html ファイルと
page.html ファイルが置かれているとします。
これらのファイルをリンクで結びましょう。
そのためには、リンクの href 属性に、
単にこれらのファイル名(拡張子付き)を書くだけです。
やってみましょう。
ページ index.html に、ページ page.html へのリンクを作成します:
<h1>Index</h1>
<a href="page.html">pageへのリンク</a>
また、ページ page.html に、ページ index.html へのリンクを作成します:
<h1>Page</h1>
<a href="index.html">indexへのリンク</a>
あなたのサイトのルートに3つのHTMLページを作成してください。
それらを 1.html、2.html、3.html と名付けます。
これらのページをお互いにリンクで結んでください。
さらに index.html ページも作成してください。
そのページに 1.html、2.html、3.html へのリンクを配置してください。
前の課題を変更して、リンクが ul リスト内に配置されるようにしてください。