［み］PukiWikiでブラウザの幅に合わせて画像サイズを変更させる方法

WordPressでは、だいぶ一般的になったレスポンシブデザインですが、PukiWikiでも、ブラウザの幅に合わせて画像を縮めたい！なんてことはよくあることと思います。

今回は、そのPukiWikiでブラウザの幅に合わせて画像サイズを変更させる方法を紹介します。

PukiWikiで画像サイズを指定する方法

PukiWikiでは、（当然ですが）画像サイズを指定することができます。

#ref(画像へのパス,300x200)
#ref(画像へのパス,80%)

わたくし、ここでちょっと勘違いしておりました。ここで100%を指定すれば、ブラウザに合わせて100%表示するもんだと思っていました。そんなわけないですねｗｗ

当然ですが、CSSで指定しないとダメです。なので、 pukiwiki.css.php に次のコードを追加します。

CSS

div#body img {
	max-width: 100%;
}

これで、メイン部の画像はブラウザに合わせてサイズ変更されるようになりました。