Akka's Note

雑記ブログ 目標:5回/月投稿 / 投資再開したい/沖縄在住

ブログの画像が間延びしてしまう現象が発生⇒解決!!

⇒この時にレスポンシブデザインにしたいため、ブログテーマ変更しました。
 スマホとPCでブログ確認してOKと思っていたのですが、実際はスマートフォンのデザイン設定で「レスポンシブデザイン」にチェックをいれないといけなかったみたいです。
 
 
ただこの設定をするとスマホで見た場合、ブログの画像が縦に間延びしてしまっていることが分かりました(ブログの書き方によっては同じように発生する人いるかも)。
#レスポンシブデザインのチェックを外すと問題ない
 
ちょっと面倒くさいですが、HTML編集モードでWidthやHeightの部分を削除する事で解決しました。
 

「レスポンシブデザイン」チェックなし

⇒レスポンシブデザインが有効になっていません。
 
 

「レスポンシブデザイン」チェックあり

⇒画像が間延びしてしまいます。
 

「レスポンシブデザイン」チェックあり&画像のWidth、Heightを削除

幅と高さを固定で持っていて、PCで見る分には問題ないサイズなのですが、レスポンシブにした際、スマホだと横幅だけ端末のサイズに調整されている動きになっているみたいでした。
 

このWidthやHeightの部分(赤枠全部)を取っ払います。(↑PCじゃないと見づらいかも)

⇒解決しました!!
 
 
#パソコンとスマホで同じ見え方するのがレスポンシブデザインじゃないの??って思ったのですが、そうではないみたいですね。
 
#ちなみにevernote連携しているせいか、毎回画像添付する際は画像が延びるので毎回Width、Heightを削除しています。。今回も><・・・いい方法ないのかしら。。
 
Evernote はあなたがすべてを記憶し、手間をかけずに整理できるようにお手伝いします。Evernote をダウンロードする

スポンサーリンク