1. たくさんのウェブサイトに、簡単にページ間を行ったり来たり出来るようにナビゲーションメニューがあります。では、トップページと中のページ が出来て、行き来できるリンクがはれたら、それらのリンクをセクションのトップにあるナビゲーション部分に動かしましょう。 
  2. <ul>タグの直前でEnterキーを押して、空の行を作り、その行に<nav>タグを打ち込みます。 トリンケットが自動的に閉じタグをつけてくれます。
  3. 今は自動的に入った終了タグを削除して、終了タグ</ ul>の直後でEnterキーを押して新しい行に移動し、終了タグ</ nav>を入力します。                                                    ・「nav」はナビゲーションを表します。 navセクションは、ウェブサイトを行き来するための場所です。
  4. 今度は、<nav>タグの直前をクリックし、</ nav>タグの直後までマウスをドラッグすると、開始タグと終了タグを含むすべてのテキストが選択されます。開始と終了の山カッコ(<と>)がすべて選択されていることを確認してください!
  5. 今回はコピーする代わりにカット(切り取り)をします。 Ctrl(またはcmd)キーを押したままにして、Xキーを押します。コードは消えますが、パニックにならなくても大丈夫!

  6. ファイルの上部にある<header> </ header>タグの間をクリックします。カーソルが点滅していることを確認してください。 そのままCtrlキー(またはcmd)とVキーを同時に押してコードを貼り付けます。変更を確認するために[実行]をクリックしてください。コードは次のようになっているはずです。

    <header>
       <nav>
          <ul>
             <li><a href="index.html">Home</a></li>
             <li><a href="attractions.html">Attractions</a></li>
             <li><a href="music.html">Music</a></li>
             <li><a href="food.html">Food</a></li>
          </ul>
       </nav>
    </header>
    

    ・もし失敗していたら、Ctrlキー(またはcmd)とZキーを同時に押して前の状態に戻すことができます。何度か押し続けると最後にした作業から何度か前に戻すことができます。この方法は、他にもたくさんのプログラムで使える便利なショートカットです。

  7. 自分のウェブサイトの全てのページ上部にナビゲーションメニューを表示させるために、新しく作った各ページのページ上部に同じコードを入れましょう。 nav セクション丸ごとを、先ほどのように選択して、Ctrlキー(またはcmd)とCキーを同時に押してコピーします。そして、他のファイル(ページ)の中の<header> </ header>タグの間をクリックし、ちょうどステップ6でしたように、コードを貼り付けます。

  8. これで、[実行]をクリックすると、どのページにいたとしても、リンクをクリックすることができます。完了したら[保存]をクリックすることを忘れないでください!

results matching ""

    No results matching ""