ブログ作成に必要な基本的なHTMLタグについて説明してます!(HTML フォント レイアウト リンク・画像 テーブルなど)

初心者のブログ作成 HTMLタグ研究所! サイト マップ お問い合せ LINK
HTMLタグの他にPC・インターネット関連用語集や便利なショートカットキー一覧 ・ 無料で利用できる便利なサイトも紹介してるのでゆっくり見て下さい!


リンク・画像タグ

画像を表示させる!<Img Src="画像"> の説明と例

1.基本の画像タグ

<Img Src="画像のアドレス">

画像のアドレスの入手方法 
デジカメなどで撮った画像やブログ素材などを配布しているサイトで入手した画像を自分のパソコンに保存して登録しているホームページサーバーにアップロード(転送)すれば画像のアドレスを入手できます。(個人のホームページを持ってる場合)

ブログを利用している場合は利用しているブログサイトのサーバーにアップロード(転送)する必要があります。

通常ブログ運営しているサイトに写真や画像をアップロード(転送)する機能があるので画像タグを利用しなくても写真や画像を貼り付けることができます。(利用しているブログのヘルプなどで確認して下さい)

通常利用できる画像形式 JPEG GIF

JPEGとは
Joint Photographic Experts Groupの略語 ファイルの大きさが小さいわりには画質の劣化が目立ちにくいというメリットがあります。 
表示できる色数は約1,600万色で主に写真画像など保存に使われています。

GIFとは
Graphics Interchange Formatの略語で画像変換フォーマットの一種です。
表示できる色数は最大256色で主にイラストなどに使用されてます。

初心者のブログ作成 HTMLタグ研究所!のバナー



<Img Src="http://pub.ne.jp/htmltag/image/user/1186271290.gif" width="120" height="60">
画像タグの簡単な説明
青い部分を含む赤い部分が画像のアドレスです。
青い部分が画像形式になります。
width="120"は画像の横幅です。
height="60"は画像の縦幅です。


スポンサード リンク


2.説明付きの画像タグ

画像表示されない場合のための画像タグ
<Img Src="画像のアドレス" Alt="画像の説明・画像名など">
画像が表示されない場合とはブラウザの設定(インターネットオプションの詳細設定など)で画像を表示しないにしている場合や画像保存場所から削除された場合、その他に何らかのエラーで表示されない場合のことです。
その場合下記のような表示になります。(見たことある人もいると思います)
基本の画像タグで画像が表示されない場合


上の画像タグを利用した場合

画像の説明・画像名など

この画像のHTMLタグ表示
<Img Src="画像のアドレス" Alt="画像の説明・画像名など">
通常の画像で利用した場合

愛車のHONDA Forza(MF08型)

この画像のHTMLタグ表示
<Img Src="http://pub.ne.jp/htmltag/image/user/1185725317.jpg" width="250" height="187" alt="愛車のHONDA Forza(MF08型)">
表示されない場合

愛車のHONDA Forza(MF08型)

この画像のHTMLタグ表示
<Img Src="画像のアドレスなし" width="250" height="187" alt="愛車のHONDA Forza(MF08型)">

スポンサード リンク


3.枠線付きの画像タグ

画像に枠線をつける場合の画像タグ
<Img Src="画像のアドレス" Border="枠線の太さ数">
枠線の太さは0からピクセル単位で指定できます!
(数字は半角英数字で入力して下さい) 
Border="0"にした場合は枠線は表示されません 
枠線の太さを1にした場合の画像



この画像のHTMLタグ表示
<Img Src="http://pub.ne.jp/htmltag/image/user/1185725317.jpg" width="250" height="187" Border="1">
枠線の太さを5にした場合の画像



この画像のHTMLタグ表示
<Img Src="http://pub.ne.jp/htmltag/image/user/1185725317.jpg" width="250" height="187" Border="5">
枠線の太さを10にした場合の画像



この画像のHTMLタグ表示
<Img Src="http://pub.ne.jp/htmltag/image/user/1185725317.jpg" width="250" height="187" Border="10">
説明付き画像タグと枠線を7に指定した場合
<Img Src="画像のアドレス" alt="画像の説明・画像名など" Border="枠線の太さ数">

愛車のHONDA Forza(MF08型)

この画像のHTMLタグ表示
<Img Src="http://pub.ne.jp/htmltag/image/user/1185725317.jpg" width="250" height="187" alt="愛車のHONDA Forza(MF08型)" Border="7">


HTMLタグを使う場合の注意点!

HTMLタグを使う場合の入力方法は半角英数字です。 基本となるHTMLタグはコピー・貼り付けで構いませんがサイズ・カラーコード・アドレスなどの数字や文字を入力する場合に半角英数字以外の文字で入力すると正しく表示されないので注意して下さい!

また、HTMLタグを入力する際は半角英数字ですが大文字と小文字の区別は無いので気にしないで下さい。

HTMLタグには
開始タグ終了タグがあります。

例)<Font Size="1〜7">〜</Font> 最初の
<Font Size="1〜7">が開始タグで後の/スラッシュが付いた</Font>が終了タグになります。 終了タグを入れ忘れた場合ページのレイアウトが崩れることがあるので気をつけましょう!

その他に、基本のHTMLタグの
<>←カッコ、"←ダブル クォーテーションやHTMLタグ内の記号・文字・数字などを消したり、スペースを空けたり・くっつけたり、改行したりするとHTMLタグが正しく表示されないので注意して下さい。

上記のミスが非常に多いので作成の際はPCのメモ帳などを利用してHTMLタグの見直しをして下さい。

また、正しく表示できない場合も
基本のHTMLタグやここで説明した内容を確認してみて下さい!

HTMLタグは最初は見なれない文字や記号が多いので意味が解らないと思いますが使用しているうちになれて読めるようになります。 少しずつ落ち着いて作業して下さい!


Copyright (C) 初心者のブログ作成 HTMLタグ研究所! All Rights Reserved. |