メモ

メモを入力してみよう!


Lesson 04「リンクを使って画面を切り替えよう!」

練習を見る

学習概要

aタグを使ってリンクを作ってみよう!
画面遷移(画面の切替)ができるようになるよ!

補足

■編集したファイルが表示されない場合
ブラウザの「キャッシュ」機能によって編集前の古いファイル内容で表示されている可能性があります。
ブラウザのキャッシュをクリアするか、ブラウザの「更新」ボタンを何度か連打すると新しいファイル内容がブラウザに読み込まれて表示されます。
それでも、表示されない場合はファイル内に書いたコードに原因があります。

この練習でわからない所を質問する※部活外の質問はできません

ログインが必要です

この練習への質問一覧

ログインが必要です

Lesson 04「リンクを使って画面を切り替えよう!」の内容※SEO用のため読めません

これからリンクを使った画面の切り替えを行っていきたいと思います。

【入門】HTML言語・CSS言語初心者まず前回作ったテストフォルダを開きその中に新しいフォルダを作成します。【入門】HTML言語・CSS言語初心者俺らを作成したら前回と同じく最初に作った INDEX . HTML ファイルを中にコピーします今回は二つコピーしましょうコピーしたファイルを開くと最初に作ったホームページが表示された図です。

ここからファイルを編集していきましょう。【入門】HTML言語・CSS言語初心者まずは1ページ目のファイルを編集していきます画面に表示された際に1ページ目とわかるように適当に編集をしていきましょう練習が終わったら次のページに移るためのリンクを作っていきますリンクを表示させるには永沢を使います。

そして HF 毒性というもので次のページを表示させるためのファイルのパスを指定します1ページ目のリンクが完成しました次に2ページ目を作っていきますコピーした二つ目のファイルの名前を適当なもので変更します今回は SAMPLE . HTML としますこちらのファイルも先ほどと同じ空の下と分かるように編集していきましょう【入門】HTML言語・CSS言語初心者。

編集が終わったら同じく A タグを使い前のページへ戻るリンクを作りますこれで2ページ目の完成です完成したファイルを開いていましょうそれぞれ1ページ目と2ページ目の画面が完成しました1ページ目の画面から3ページを1ページ目の画面が表示されます表示された2ページ目のマイページへゴースト1ページ目の画面が表示されますこれで画面の切り替えを行うことができましたここからですねすについて前回の画像の時と同じくと解説をしていきたいと思います【入門】HTML言語・CSS言語初心者。の中には H デフ属性というものを使って次の画面ですね続きの画面のパスを指定していますというのは場所のことでしたけれども今回のバスは SAMPLE . HTML なので INDEX . HTM 表示させる HTML ファイルと同じ場所にあるサンプルドット絵しているファイルにリンクさせますよそれを表示させますよという形になります2ページ目も同じくですねサンプル. H メールファイルから見た時の同じ場所にある INDEX . HTML ファイル表示させてますよという形で指定がされていますなので音読箱のサンプルドット絵しているファイルこれが ファイルと同じ場所にあるリンクというフォルダの中にあったとしますそうするとそうすると指定しているパスと実際の場所が違うので画面が表示されなくなります。

次ページへのリンクをしてみてもですね指定したパス指定したファイルの場所には実際にはファイルはありませんよという形で見つかりませんでしたとなりますなのでこういう場合の1ページ目のリンクにはですねパスをリンクフォルダの中にある SAMPLE . HTML としたいのでリンクスラッシュ SAMPLE . HTML というパスにすることでリンクをフォルダの中にあるシャンブルドット絵しているという形になります【入門】HTML言語・CSS言語初心者。リンクに指定したパスと実際のファイルの場所があるので次ページを押すとちゃんとページが表示されますこのリンクのパスにはですね今のホームページの URL を指定することもできますので例えばこのバスに2 sttt から始まる言葉 Google のホームページの URL アドレスを入れたそれで次ページをしてみると外部のグーグルのホームページが表示される【入門】HTML言語・CSS言語初心者ということになります。