メディアクエリで、このブログをiphoneサイト対応しました

スマートフォン。ではなく、iPhoneのみ対応させました。 このブログくらいであれば、メディアクエリのみでできそうだったので、

@media only screen and (-webkit-min-device-pixel-ratio: 2) and (min-width: 320px) {
} 

を使って、Retinaディスプレイのiphone4以降と通常のディスプレイiphone3未満に対応してると思います。 次はiphone用のwordpressテーマを作ろうかと。 ちなみに、よくみる他のディスプレイのメディアクエリ指定は以下。

/* 低解像度のPCブラウザなど */
@media only screen and (min-width: 768px) and (max-width: 995px) {
}

/* iPadとかタブレット用 */
@media only screen and (max-width: 767px) {
}

/* iPhone用 */
@media only screen and (min-width: 480px) and (max-width: 767px) {
}