なんか久々ですが、
気にせずに更新します。w



ブログを書いていて
写真を貼り付けることはよくありますよね。


みなさん、思い思いの写真をアップして、
記事に彩りを添えているかと思います。




記事に貼られた写真は、
マウスでクリックすると拡大されますよね。


それ、
邪魔に感じたことはあませんか？


いろんな理由で、
画像が拡大しないようにしたい！
という方もいるでしょう。


今日はその方法をご紹介します。




まず前提として
「タグ編集エディタ」を使って記事を書いてること。


ＨＴＭＬタグが編集できない状態では、
写真の拡大を止めることは難しいでしょう。




ブログ記事内の拡大する写真は、
ＨＴＭＬタグでは次のように書かれています。

<a href="http://●●●●.jpg"><img src="http://○○○.jpg" alt="※※※"></a>

ブログサービスによって、
細かな違いはありますが、
だいたいこんな感じになってます。





<a href="http://●●●●.jpg"><img src="http://○○○.jpg" alt="※※※"></a>

赤い部分が画像本体を指し示しています。

つまりホンモノです。




<a href="http://●●●●.jpg"><img src="http://○○○.jpg" alt="※※※"></a>

緑の部分がブログ記事に表示されている画像を指し示しています。

これはニセモノです。




<a href="http://●●●●.jpg"><img src="http://○○○.jpg" alt="※※※"></a>

http://●●●●.jpgがホンモノの画像で、
http://○○○.jpgはニセモノです。





では写真の拡大を消したいと思います。




まず
ホンモノの画像部分である「http://●●●●.jpg」を
マウスで選択してコピーしておきます。



次に
ニセモノである「http://○○○.jpg」部分に、
さっきコピーした「http://●●●●.jpg」をペーストします。




するとこうなります。

<a href="http://●●●●.jpg"><img src="http://●●●●.jpg" alt="※※※"></a>




あとは

<a href="http://●●●●.jpg"><img src="http://●●●●.jpg" alt="※※※"></a>

不要な赤い部分をマウスで選んで
キーボドの[Backspace]もしくは[Delete]キーで消します。


一番後ろにある</a>も
消すのを忘れないように注意してくださいね。




するとこうなります。

<img src="http://●●●●.jpg" alt="※※※">


これで拡大しない写真が
ブログに表示されるようになります。






表示されているホンモノの写真が大き過ぎる！
という問題が発生するときは、

次のようにタグを追加します。

<img src="http://●●●●.jpg" alt="※※※" width="400">


width="400"というのは、
表示される画像の横幅のサイズの指定です。


width="400"だと
横幅４００ピクセルで表示されるという意味です。


横幅を指定すれば、
元の画像の縦横の比率を保ったまま表示してくれます。



もし画像の縦のサイズを指定したければ、
height="200"
というふうにタグを追加してください。


こんな感じに。
<img src="http://●●●●.jpg" alt="※※※" width="400" height="200">


縦横のサイズは、
ご自分のブログにあわせて決めてくださいね。



でわ ^^)/~

このブログの目次