れびうぶろぐ　@楽天ブログ

画像の貼り方

TOPページ > 初心者のためのタグ講座

2．画像の貼り方

01. テキスト、フォント関係	02. 画像の貼り方	03. リンクの貼り方	04. テーブルタグその1
05. テーブルタグその2	06. テーブルタグその3	07. テーブルタグその4	08. テーブルタグその5
09. テーブルタグその6	10. テンプレの作り方	11. テンプレの作り方-日記編	12. その他のタグ

ここで説明することはアフィリエイトの画像を貼ることではなくて
自分で用意した画像を利用したい場合の貼り方です。

念のため画像を楽天にアップする方法と画像へのパスを調べる方法を説明しておきます。

まずログインして画面左側のメニューの「ページ作成・編集」から「画像倉庫(画像の登録管理)」をクリックします。
そうすると「画像を登録する」という項目があるのでそこで「参照」をクリックします。
すると自分のPCの中から使いたい画像を登録することが出来ます。

次は画像へのパスの調べ方です。
「画像倉庫(画像の登録管理)」の「登録した画像の一覧」から使う画像をクリックします。
「この画像を表示する」の所にソースが出てきます。
<IMG SRC="http://plaza.rakuten.co.jp/img/user・・・・・（省略）
というやつですね。
必要な画像のパスというのは<IMG SRC=の後の""で囲まれたURLです。
"http://～.gif" httpから画像の拡張子の部分までです。

これでパスの調べ方は分かったと思います。

画像を表示する
<img src="画像へのパス">
これはただノーマルに表示するだけです。

画像の説明
<img src="画像へのパス"　alt="説明">
これは画像が読み込まれなかった場合に、
ブラウザ上にどういう画像が表示されるはずだったのかを説明するためのタグです。
画像の上にマウスを重ねた際にもポップアップで表示されます。

画像サイズの指定
<img src="画像へのパス"　width="横幅" height="高さ">
こんな感じになります。

width="100" height="100"
の場合

width="50" height="150"
の場合

width="130" height="50"
の場合

画像に枠を付ける
<img src="画像へのパス" border="枠の太さ">
こんな感じになります。

太さが０の場合

太さが2の場合

太さが５の場合

画像の横のテキスト位置の指定
<img src="画像へのパス" align="表示位置">
表示位置というのは「top」「middle 」「 bottom」の３種類です。
これを指定しない場合はbottomが選択されていることになっています。

こんな風になります。	こんな風になります。
こんな風になります。

画像の回り込み表示
<img src="画像へのパス" align="表示位置">
表示位置は「left」か「right」で指定します。
「left」は画像が左側に、「right」は画像が右側に来ます。
この表示方法だと画像の横に複数行の文字の表示が出来るので非常に便利です。
<br>で改行が出来ます。

こんな
風に
出来ます。

TOPページ > 初心者のためのタグ講座