画像をはり付けてみる。

写真をはり付けてみる。

今までホームページの練習にカウンターを付けたり水平線を引いたりしてみましたが、どうせなら画像を載せられたほうがページが華やかになりそうです。

今回は画像をページに飾ってみましょう。

それには <img src=" "> という文字列の" " の部分に画像がおいてある住所を書きこむことで可能になります。
とりあえず難しい理屈はあと回しにして、じっさいにやってみることにしましょう。

まず、下の文字列をコピーしておきます。

<img src="http://dekiruhomepage.web.fc2.com/images2/shasin6.jpg" width="280">

やり方は「左クリック」しながらマウスをドラッグして青い領域で英字を囲む → 「右クリック」→ 「コピー」の順です。

画像はり付けタグ

そうしたら、「おためしページ」のファイルを開いてコピーした文字列をてきとうな位置にはり付けるのです。

おためしファイル

1.おためしページを作る」で作った「おためし.html」のファイルを、「右クリック」 → 「プログラムから開く」 → 「メモ帳」の順に実行します。

あのごちゃごちゃした英字のファイルがでてくるので、その中にはり付けするのですがここでは


<table border="1" cellspacing="1" width="300" height="240">
  <tr align="center">
    <td bgcolor="#f0f0f0" align="center"></td>
  </tr>
</table>
  
と書いてあるところの <td bgcolor="#f0f0f0" align="center"></td> の間にさし込んでみます。

imgタグのはり付け

ちょうど</td>という文字の左側あたりにマウスの矢印をおいて「右クリック」 → 「貼り付け」としてみましょう。
上図のように<img src からはじまる文字がさし込まれたと思います。

これでおためしページに画像がはり付けられたので、左上にある「ファイル」をクリックして「上書き保存」してから、「おためし.html」のファイルをダブルクリックして開いてみましょう。

画像のはり付け
おためしページ

ページ上に画像が現れたのが確認できましたでしょうか?

ホームページ初心者の人であれば、ソースコード文の意味がわからなくとも当然なのですが、とりあえずヘンな文章を"切りはり"してるうちにページが改良されていくのを理解できたと思います。
じっさいの作業はこれのくり返しだと思ってください。

あとは日々つづけるだけです。
といっても、それが結構めんどくさいので、お金をはらうことで作業を代行してくれる業者がいたりするのですが……。

その話は今はおいておくとして、これで画像のはり付けの超基本は終了です。
ごちゃごちゃして分かりづらいですが、そんなに難しくはないのです。。。


さいしょのページに戻る
inserted by FC2 system