Ｗｅｂページの作成 最初の一歩 （ link.html ）
舞子の浜
↑
ここをクリックすると
舞子の浜を表示する
|
左のようなリンク集のページ ( link.html 例ではリンク先は一つだけですが ) を作ります。リンクは他のページやサイトに移動する基本です。
- 【 HTML文書の説明 1-1 】
- リンクを貼るには a タグ を使います。a は anchor（錨 ＝ 頼みの綱を象徴する） の頭文字をとっています。
|
メモ帳を開いて以下の文字を打ち込み、「link.html」と名前を付けて保存して下さい。説明は後ほど行います。
<html>
<head>
<title>最初の一歩</title>
</head>
<body>
<a href="http://maikonohama.la.coocan.jp/">舞子の浜</a>
</body>
</html>
|
《手順》
- メモ帳を開く
「スタート」 → 「プログラム」 → 「アクセサリ」 → 「メモ帳」をクリック
- 上の文字を打ち込む
キーボードから一文字ずつ打ち込んで行くのですが、つぎのような便法があります
《便法》 画面上の <html> にマウスカーソルを移動させ、左のボタンを押しながら最下行の </html> までドラッグ → （文字が反転する） → 「Ctrlキー」を押しながら「ｃ」キーを押す（選択した範囲がクリップボードにコピーされる） → メモ帳をアクティブにする（メモ帳にマウスを移動させる） → 「Ctrlキー」を押しながら「ｖ」キーを押す（クリップボードの内容を貼り付ける）
- 名前を付けて保存する
メモ帳の「ファイル」 → 「名前を付けて保存」をクリック → ダイアログが表示される → 保存する場所（フォルダー）を指定 → ファイル名を「link.html」とする → 「保存」ボタンをクリック
《動作確認》
- デスクトップにある「マイドキュメント」をダブルクリック → （マイドキュメントが開く） → 保存した場所（フォルダー）を指定 → （ フォルダーが開く） → link.html をダブルクリック
- ブラウザーが開いて「舞子の浜」の文字に下線が付いているはず → 下線の付いている文字をクリック → 「舞子の浜」のトップページが開けばＯＫ！
- 【うまく表示されない場合】
(1) 打ち込んだ文字に間違いがないか点検 → 間違いがあれば修正
(2) （メモ帳の）ファイル → 「上書き保存」を指定
(3) （ブラウザーの）更新ボタンをクリック
(4) 「舞子の浜」のトップページが開くか確認をする
【 HTML文書の説明 1-2 】
- <title>最初の一歩</title> によって「最初の一歩」という文字をタイトルバーに表示させます。ブラウザーの画面には現れないので head部に書きます
- リンク先のURLは aタグ内で href="・・・・・"とし、「・・・・・」の個所にURLを書きます
リンク先はこの例のようにインターネット上のサイトでも、自分のフォルダー内にあるファイルでもかまいません
- 「舞子の浜」の文字は画面に表示させるので body部に書きます
|
戻る