レスポンシブデザインで画像サイズを可変させる方法?!魔法の呪文があった。

こんにちわ。
なんだか、よくブログテーマを変えてます。
変える度に、素人なから過ごしいじっていたCSSやらが変わってしまいます。
レスポンシブデザインのテーマならサイズに合わせて画像サイズとかも調整してくれる仕組みが、あっても良いと思っていたのですが、気付くと画像が画面からはみ出してることもしばしば。
固定サイズの画像を毎回利用して決まった比率とかにしてしまうのが、見た目も良いとは思いますがなかなかそうもいきません。
そこで今回はCSSでなんとかならないかと悪戦苦闘してたら神の手が!?

����¯�¿�½������¦������¯������¿������½����¯�¿�½������¥����¯�¿�½������£������¯������¿������½������¯������¿������½����¯�¿�½������£������¯������¿������½����¯�¿�½������®����¯�¿�½������§������¯������¿������½������¯������¿������½����¯�¿�½������¦����¯�¿�½������´����¯�¿�½������»����¯�¿�½������£������¯������¿������½����¯�¿�½������«happy����¯�¿�½������£������¯������¿������½������¯������¿������½����¯�¿�½������£������¯������¿������½������¯������¿������½����¯�¿�½������£������¯������¿������½����¯�¿�½������©����¯�¿�½������£������¯������¿������½����¯�¿�½������¹����¯�¿�½������£������¯������¿������½������¯������¿������½����¯�¿�½������£������¯������¿������½������¯������¿������½����¯�¿�½������¯����¯�¿�½������½������¯������¿������½����¯�¿�½������£������¯������¿������½������¯������¿������½����¯�¿�½������£������¯������¿������½������¯������¿������½����¯�¿�½������£������¯������¿������½����¯�¿�½������¿����¯�¿�½������£������¯������¿������½����¯�¿�½������¹

IMGタグに魔法の呪文

max-widthを設定し、最大の横幅が100㌫になり最大サイズにみたない写真や画像はそのまま表示されます。
このコードをスタイルシートに書いてあげるだけです。
[html]
img {
max-width: 100%;
height: auto;
}
[/html]
IE8とかだとおかしくなる噂ですが、幸いPC表示のことはここでは考えていないので、これだけで大丈夫なはずです。

まとめてみると

本当にこれだけで今のところ希望に近い状態の表示になってます。
やっぱりHTMLは、難しい。
オススメ記事

[WP]超SEO対応のStinger2へテーマ変更 |
FireFox AddOn『Web Developer』
WordPressヘッダに検索バーを埋め込む方法

こんな記事のリクエストからディズニーランドに一緒に遊びに行きませんか?というお誘い、写真を一緒に撮りに行きましょうというお誘い、誤字・脱字をはじめ全てのお問い合わせは、こちらへお願いします。
定期的な購読はRSSにご登録お願いします。
掲載している写真の個人的利用、保存はOKですが、複製、再利用、営利目的の利用は禁止です。