4.imgタグの使い方

画像を表示するものが、imgタグです。オプションに、src="アドレス"を指定します。タグは、基本的にはアルファベットの大文字小文字は関係ありません。以後は、キィボードの半角入力をそのまま使って、小文字で表記します。

imgタグのポイントは、アドレスです。

●すでに、インターネットに公開されている画像を使う

ブラウザで開いた画像を、右クリックします。メニューから、画像アドレスをコピーします。

 

新 し い タ ブ て 費 ぐ 
新 し い ウ イ ン ド ウ て ぐ W ) 
シ ー ク い ト ウ イ ン ド ウ で 背 く ( G ) 
Pinte 「 est て リ ン ク を 背 く 
ロ NO F ョ に リ ン ク を き 信 
名 前 を 付 け て リ ン ク 先 を 保 存 凶 ... 
リ ン ク の ア ル ス を コ ビ - 旧 
新 し い タ ブ て 亘 像 を 弩 く 働 
名 前 を 付 け て 画 を を 保 停 Ⅳ ) … 
亘 像 を 」 ビ - ( v ) 
画 像 ア ド レ ス を コ ビ - ( C) 
( な ト 引 1 れ

 

すぐにメモ帳を開いて、張り付けます。

張り付けたアドレスの先頭にカーソルを入れて、タグカッコ img スペース エス・らアール・シー・イコール・ダブルクオーテーション を追加します。カーソルを最後に移動して、ダブルクオーテーション・タグカッコ閉じ を入れます。これを、拡張子htmlで保存します。保存したhtmlをWクリックで開き、画像が表示されるのを確認しますが、メモ帳はそのまま開いておきます。

●imgタグに、サイズを追加する

タグの中に、width= 数字 を追加すると、表示する画像の横幅を指定できます。昔は、データ量を減らすために、画像ファイルを表示するサイズに縮小しましたが、今は印刷などの再利用を考えて、画像ファイルは表示サイズより大きくしています。サイズ指定はwidth=で横幅、height=で高さを指定できますが、比率を正確に指定しないと画像がゆがみます。計算はブラウザに任せて、どちらかだけの指定で構いません。

画像を、実寸より縮小して表示している場合、右クリックで、画像を別ページで開けば、拡大画像が見られます。

 

https://i .p in mg. con/236x/06/ee/12/06eel 22bd9cged983e2f bC)5f99901637 . jpgl 
lesson2.htmI - 
Kltng src="https:// 
•lesson2.html - 
<irng src-"https://i 
. pi n i mg. corn/564x/06/ee/12/06ee 122bdgcged983e2fb05f99901637. jpg" > 
.pinimg. corn/564x/06/ee/12/06+122bdgcged983e2fb05f99901637. jpg"

 

新しいタグで開いたものが、右です。