TOP > 記事を書いたら・・・ > title − 画像の大きさを指定する
画像の大きさを指定する
前回のこの画像見たけど、本文が下記の様になってますよね。
<a href="http://blog-imgs-41.fc2.com/r/g/r/rgrg/200604031 13327.jpg" target="_blank"><img src="http://blog61.fc 2.com/r/rgrg/file/20060403113327.jpg" alt="大仏" border="0"></a><br clear="all">
その最後の部分に
alt="大仏" border="0"width="350" height="260"> </a><br clear="all">
赤字で書いたものを入れるんです。
これはwidth="350"=横の長さ
height="260"=たての長さなんです。

これは元の画像の大きさは909×682で元画像を選んで上記のサイズに指定したものです。サイズを指定しなかったら写真が大きすぎて、僕のブログもぐちゃぐちゃになっちゃいます。クリックすると元の大きい写真が見れるのでわかりますよね。この大きさだとブログの枠からはみ出してしまいますよね!
ちなみに元画像じゃない、他の方法を選んだ場合はどうなるかを紹介しますね。

これは元の画像の大きさは909×682でサムネイルを選んだ場合です。サイズの指定はしていません。クリックすると上の様に大きい写真になります。

これは元の909×682の画像をあらかじめフリーソフトで350×260に小さくして、元画像を選んだ場合です。クリックしても大きさが変わりませんよね。

これは上の様にあらかじめ350×260に小さくして、サムネイルを選んだ場合です。クリックすると上の写真と同じ大きさになりますよね。
元画像を選んだ時は、width="350" height="260"この様にサイズを指定しましょう。3番目の大仏はもともと350×260だけど、わざわざ本文中でもこの様に指定してあります。指定してなくても、全く同じように表示されるにもかかわらずです。
なぜかというと、画像のサイズを指定していると表示速度が速くなるんです。みんなに見てもらう時に遅いと申し訳ないし、そんなブログはあなたも見たくないでしょ。だから同じでも指定しましょう。
他にもwidth="30%" height="30%"の様に%でサイズを指定する事もできます。
4つの写真を見るとそれぞれ特徴がありますよね!自分が見せたい大きさで、一番綺麗に効率よく見せれる方法を選んで写真を載せましょう。
※でもサイズの指定はいいけど、width="350" height="260"なんて毎回入力するのはめんどくさいなーって思いませんか?よく使いそうだからめんどくさいなぁと感じる人は[辞書登録の方法]を読んで下さい。
コメント
- おひさしぶりです。
- るんぱぱさん、おひさしぶりです。
あれから、じぶんなりにかなり頑張っております。
こちらに、そ〜ーーーっと来ては、テクニックを印刷してブログ画面と戦っております。
今日は画像の大きさが変わらないようにする方法をいただきにきました。^m^
こんど、生徒がどんな風になってるか見にきてくださいね〜(*^_^*)。
- おひさしぶりですね。
- リルアンジュさんこんにちは。
僕もリンクしていただいているブログには、足跡を残さずこっそりと訪問しているから
リルアンジュさんのブログもたまに見に行ってますよ!
でも今日は足跡を残して訪問してみました。ヾ(^▽^*
だから実はリルアンジュさんが頑張っている事も知ってますよ!
そしてブログの記事の内容も面白いですよね。僕は霊感みたいな物がま〜〜〜ったくないので、
話の内容がなるほどーと興味深いものばかりです。
このブログを印刷してまで見ていただいているなんて本当にありがたいです。
またわからないことなどがあったら、気軽にコメントして下さいね。(o^-^o)
- 新たな技が!
- 再びすいません。
見ててくれたんですね。ありがとうございます。
すっごい、うれしいです。
足跡を残さないでみる…又新しい技をしりました。
奥が深いです。Fc2…。
- Re;新たな技が!
- そうなんです。足跡を残さないで見れるんですよ〜。
「環境設定の変更」を見るといろいろな事が実は設定できるから意外と面白いですよ!
う〜む。今度は「環境設定の変更」でできることをまとめた記事をつくろうかなぁ〜。
- 画像が大きくて・・・・
- はじめまして。
パソコン初心者な上に、ブログを始めてしまいました。
画像の練習と思いやってみたら、kbと大きく小さくする事がわかりません
ブログを読ませてもらいましが。。。。縮小ソフトを使わなくても出来るようになりませんか?
- 画像サイズ
- くま子さん、初めまして。
FC2ブログは250KBまでの.jpgや.gifや.pngの画像をアップロードができるのですけど、
くま子さんの持っている画像のサイズが250KBより大きいからアップロードできないということでしょうか?
だとすると、画像が大きすぎると思うのでWindowsなら始めからついている「ペイント」を使ってサイズを小さくできますよ!
http://hamachan.fun.cx/windows/peint.html
ここがわかりやすいと思うので参考にしてみて下さい。
- 画像のサイズって設定出来るんですね
- はじめまして、るんばばさん。私も超初心者です。(実は初めて5日です)
とりあえず書けば何とかなる…と始めましたが、
さっぱりわからないことが出るわ出るわで、こちらのブログに後光が見えます。
画像のお話もとても勉強になりました。
他の方へのアドバイスも読ませてもらって、あ〜っそうなのね!と早速やってみたり。
これからも、毎日勉強にこさせてきただきますので、どうぞよろしくお願いします。
- 初めまして!
- はらぺこゴンベさん、こんにちは。
ブログ初めて5日ですか!!始めたばかりだと本当にわからないことばかりですよね。
でも毎日、ブログに記事を書いていればすぐに慣れてしまいますよ!
こちらこそ、これからもよろしくお願いしますね。
- 画像が、、、
- はじめまして、yumiと申します。
初心者にはとってもやさしいブログですね^^
手取り足取りってかんじで、とてもわかりやすくてバイブルのようです☆
ですが、どうしても不具合がでるので教えてください。
画像の大きさをるんぱぱさまのおっしゃるとおりに、サイズ変更しました。
本当は全部元画像の30%で載せたいのですが、そうしてしまうと縦長になってしまう画像がでてくるのです、、、
アマゾンもプラグインに残しておきたいので外したくないです。
本当は画像をチョコレートの画像くらいにしたいのですが、プレビューの段階で
はみ出してしまうので、それをみながら変えているという状態です。
今見ると、画像は縦長にはなっていませんが、また新しい記事を投稿する時に
どうなるんだろうと、???不安です。
ほかにもわからないことが多すぎて、るんぱぱさまのこのブログとにらめっこしつつ
なんとか頑張ってひとつずつ解決したいと思っています。
どうぞよろしくお願いします☆
- 初めまして!
- ブログを褒めていただいてありがとうございます。とっても嬉しいです。
yumiさんのブログを見てみたのですが、一応縦長にはなっていなくて元の画像の大きさの比率のまま小さくなっていました。
でも画面を更新すると最初の一瞬縦長に表示されて、その後すぐに正常の大きさになるといった感じなのでこれが正常に戻らない時があるのかな〜と思いました。
yumiさんは全部の画像をチョコレートの画像くらいにしたいとの事なので画像の大きさを%ではなくて直接の大きさの数字で指定みてはいかがですか?
チョコレートの画像はwidth="136" height="102"です。そうすれば縦長になる事はたぶんないと思います。
もし不都合な事が起こったらまた教えてくださいね!!
- できました☆
- るんぱぱさん、早速のお返事ありがとうございました。
ちゃんと、できました!うれしぃーー^^
で、また質問なんですけどサイズの数値なんですけど、なにかきまりがあるのでしょうか。
200、150もほかで見つけたのですが、このサイズがしっくりきました。
これでしばらく続けてみようと思います。
あと、アマゾンの画像のみを載せることとセンタリングも使ってみました〜
また質問させてくださいね☆
- できましたネ!
- 上手くできてよかったですね!!
サイズの数値には何も決まりはないですよ。
なので「136 × 102」や「200 × 150」に必ずしなくてもyumiさんの指定したい好きな大きさに指定しても大丈夫ですよ。
記事によって写真の大きさを変えたり、その日の気分で大きさを変えてもOKです。
ただ記事の幅の問題から横の長さは最大でも「445」ぐらいまでにしないと枠からはみ出てしまうので注意して下さいね。
アマゾンの画像の「かもめ食堂」良い感じですねミ☆
- またまた助けを求めてやってきました^^;
上の質問の流れで、大きさを指定した画像同士を、横に並べる場合は
何処に align="left"、<br clear="all">を入れたらいいのでしょう?
何度やってもうまくいきません、、、
たとえば="0"のあとにwidth="200" height="150" を入れるのが先かalign="left"を入れるのが先かということだと思っているのですが。
いつもすみませーん、、、
- どこでもいいですよ!
- 順番はどちらが先でも大丈夫ですよ!
<a href="〜〜〜" target="_blank">
<img src="〜〜〜" border="0"width="200" height="150" align="left"></a>
<a href="〜〜〜" target="_blank">
<img src="〜〜〜" border="0"width="200" height="150"></a>
<br clear="all">
おおまかに説明すると、こんな感じになります。わかるかなぁ?
- なんとなくできた
- わあっ!さっそくのお返事ありがとうございます^^
えーっとるんぱぱさまのお答えを参考に考えましたが、1枚目の画像の最後の部分の
<br clear="all"> は消すということでしょうか?
あと、画像と画像の隙間を空けるのは、スペースをいれてもいいのでしょうか??
たびたびすみません。。。
- スペースを空けるには。
- そうですね!1つ目の<br clear="all">は消して下さい。
画像と画像の隙間を空けるのは、スペースでもOKですよ!
スペースで思い通りに空かないと思ったら、
http://rgrg.blog61.fc2.com/blog-entry-117.html
このページで紹介している「個々の画像で離したい」のタグを使ってみて下さい。
例では画像と文字で説明していますが、画像と画像でも同じです。
- 管理人のみ閲覧できます
- このコメントは管理人のみ閲覧できます
- 鍵コメさんへ
- ブログを見たところちゃんと画像のサイズを指定して小さくなっていたから解決したのかな?
もし元の画像を小さくしたい(クリックしても小さい画像)なら画像を小さくする「縮小専用。」などのフリーソフトを使って下さい。
http://i-section.net/software/shukusen/
削除はタグを消せば記事からは消えるし、ファイルアップロード→削除で画像のデータそのものが消えますよ。
- 御礼です!
- 画像のしょりに苦しんでいましたが、お蔭さまで無事ほぼ思い通りにアップ出来ました。
欲を言えば、もう少し画像を大きく表示できたらと思っています。今後もこのページを参考に見られるブログに育てたいです。
- kojirohjrさんへ
- 画像が上手くアップできてよかったですね!
画像を大きく表示するには、今、kojirohjrさんは画像の大きさを
width="350" height="260" と指定していますが、
width="400" height="300" などど数字を大きくすれば大きな画像になります。
なので、大きさはご自分で好きな大きさのサイズにすることができますよ。
- はじめまして!
- はじめまして。ブログ超初心者です。そんな私に目からウロコ!の情報がたくさん
載っていて感謝しています。何をどうすればいいのかわからない私にとってとても
勉強になります。これからもお世話になると思いますのでよろしくお願いします。
ありがとうございます!
- まりっぺさんへ
- はじめまして!かなり未熟なブログですが、こちらこそよろしくお願いします。
まりっぺさんは絵がとても上手で羨ましいです!!
この記事のトラックバックURL
http://rgrg.blog61.fc2.com/tb.php/19-e70f5c33










