HTMLタグ 画像の挿入
HTMLタグ 画像
画像はホームページを彩るのに必要不可欠です。文字だけのWebサイトではなんか味気ないですし、訪問者もすぐ帰ってしまうかもしれません。ここではHPに画像を挿入するためのHTMLタグを解説しています。
(<img src="URL" width="幅" height="高さ" alt="代替テキスト">)
画像を入れる
画像を入れるにはimgタグを使います。
imgタグで横幅や高さを指定しておくと大きな画像でも小さく載せることができます。
また、altタグはできるだけ入れたほうがいいですね。
特に目の不自由な人は音声ブラウザという声でホームページの内容を読んでいく専用のブラウザを使用しますので、画像だけ貼っても、目の不自由な人にはまったくわからないのです。
そこで、代替テキストを入れれば、目の不自由な人でも画像がどんなことを表しているのかが、わかるようになるのです。
ちなみに画像の上でマウスを当てると文字が出てくるのが代替テキストです。
※例
<img src="URL" width="150" height="156" alt="パソコンを教える男性">
↓↓↓
画像にテキストを回り込ませる(<align="位置">)
こちらも<img src="URL">内に書くタグです。
画像を右または左に動かし、その横にテキストを回り込ませることができます。
ただ、こちらも現在非推奨タグですので、できるだけスタイルシートで編集してください。
※例
今日はパソコンスクールに行ってワードの使い方を習いました。
少し難しかったけど、なんとか出来るようになりました。
来週はエクセルの使い方を教えてもらいます。
<img src="URL" alt="パソコンを教える男性" width="150" height="156" align="left">
↓↓↓
今日はパソコンスクールに行ってワードの使い方を習いました。
少し難しかったけど、なんとか出来るようになりました。
来週はエクセルの使い方を教えてもらいます。
また通常、回り込ませたテキストと画像の間を指定するために <vspace="縦間隔" hspace="横間隔">を入れます。間隔の値はピクセルで調整します。
※例
<img src="URL" alt="パソコンを教える男性" width="150" height="156" hspace="10" vspace="10" align="left">
↓↓↓
今日はパソコンスクールに行ってワードの使い方を習いました。
少し難しかったけど、なんとか出来るようになりました。
来週はエクセルの使い方を教えてもらいます。
スポンサードリンク
基本的なHTML講座
- テキスト
- フォント・レイアウト
- リンク
- 画像
- リスト
- テーブル
※当サイトのテキスト・画像等すべての転載転用、商用販売を固く禁じます。
