ホーム > スタッフブログ > ぐっちゃん > HTMLの基礎 リンクをはろう

スタッフブログ

HTMLの基礎 リンクをはろう


 

さて、今回は重要なタグですよ。

リンクをはってみましょう!


『お前のハートにリンクしてやるよ…』

 

 ——————–

<a href="URL">文字</a>

——————–

これがリンクの基本タグです。

画像にリンクをはるときは、

——————–

<a href="URL"><img src="画像ファイルURL" alt="画像コメント" width="画像の横幅" height="画像の縦幅"></a>

——————–

上のように、画像タグをリンクタグではさむとリンクをはることができます。


『ほーう』
 

 リンク先URLは、http?から始まる絶対パスか、サイトURL以降の相対パスで書いてください。


『絶対、相対って何』]
 

例えば、ここの場合URLは https://www.cyber-wave.jp/html/html-4.html となっていると思います。

これは、https://www.cyber-wave.jp/というお家の中に、htmlというお部屋があって、そのお部屋の中にhtml-4.htmlさんがいますよ、という意味になります。


『ふんふん』

 
絶対パスとは、http?から以降全てを書いたURLを言います。

相対パスとは、https://www.cyber-wave.jp/ ←このお家の部分を省いたURLを言います。


『 html/html-4.html ってことか。省いたら表示されないんじゃないか?』
 

同じお家の中でなら、大丈夫なんです。


『へー!』
 

ただし、他人のお家・・・http://●●●●●●●/ この●の部分が違うサイトにリンクをはる場合は、必ず絶対パスで書きましょう。


『全部絶対パスで書けば確実なんじゃ??』
 

そうですね。でもサーバー移転や、リニューアルのご予定があるのならば、相対パスで書いておくと作業をスムーズに行うことができます。
(※MovableTypeでは相対パスが絶対パスに変換されてしまうことがございます。)


『へ?』
 

前回やった画像のURLも相対パスでご案内しました。


『へ?』
 

おぱんだ様、へ?しか言ってませんが大丈夫ですか?


『だいじょぶ』
 

リンクなども他同様、実際にいじりながら覚えていきましょう。

慣れが一番!というわけです。


『がんばれ』
 

人事じゃないですよおぱんだ様!

さて、おぱんだ様も眠そうなので今回はここまでです。

次回は『文字・画像をレイアウトしてみよう』です。


『お楽しみに』

 

トップへ戻る

お問い合わせ

お電話でお問い合わせ

有限会社サイバーウェーブ

099-219-9720

受付時間:9時〜18時

メールフォームからお問い合わせ

クリックするとメールフォームが開きます

メールを送る

SNSからお問い合わせ