- 「lesson.html」を開く
- ここでは「lesson.html」で書いたタグについて説明しますので、htmlファイルを開くを参考に「lesson.html」のソースを開いてください。
既に開いている場合にはそのまま作業を続けます。
- リンクする場所を作る赤字で表示されているところが変更箇所です。
- リンクとは指定された場所から特定のページや場所に飛ぶことです。
以下のリストに「基本タグのページへ」という文字を書いて、ここから「lesseon.html」へのリンクを貼りましょう。ファイルの上書き・更新を参考に「lesson.html」を更新します。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <title>初めてのＨＴＭＬ</title> </head> <body bgcolor = "#3300CC" text = "#FF99CC"> ←bgcolor = "#3300CC"を削除します。 はじめてＨＴＭＬを書いています <h1>見出し１</h1> <h2>見出し２</h2> <h3>見出し３</h3> <h4>見出し４</h4> <h5>見出し５</h5> <h6>見出し６</h6> <p>段落１</p> <p>段落２<br> 現在ＨＴＭＬの勉強に挑戦しております。<br> メモ帳で入力した文字がなぜブラウザで見られるのか不思議です。 </p> 基本タグのページへ </body> </html>
bgcolor = "#3300CC"を削除したのは単に文字の色を見やすくするためです。
これだけではただ単に文章が追加されただけです。
次には追加された文章をクリックしたら「hana.html」に飛ぶようにしましょう。
- リンクを貼る
ファイルの上書き・更新を参考に「lesson.html」を更新します。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <title>初めてのＨＴＭＬ</title> </head> <body bgcolor = "#3300CC" text = "#FF99CC"> はじめてＨＴＭＬを書いています <h1>見出し１</h1> <h2>見出し２</h2> <h3>見出し３</h3> <h4>見出し４</h4> <h5>見出し５</h5> <h6>見出し６</h6> <p>段落１</p> <p>段落２<br> 現在ＨＴＭＬの勉強に挑戦しております。<br> メモ帳で入力した文字がなぜブラウザで見られるのか不思議です。 </p> <a href = "hana.html">基本タグのページへ</a> </body> </html>
「lesson.html」の「基本タグのページへ」という文章の色がブルーになり、下線がつきました。
そして、この文字の位置にマウスポインタをあわせると白い矢印から人差し指で差している形に変わります。
その状態でクリックすると「hana.html」が表示されます。
これでリンクが貼れたことになります。
以上でＨＴＭＬの練習は終わりです。
どうでしたか？以外に簡単だったのでは？
次からはもっと多くのタグを紹介しながら実際にも使えるようなページを作成していきます。