新しいiPhoneが出ました。iPhone8, と iPhone X。

いろいろ気になることはあるものの、Webをやっていると画面サイズ(横幅)が気になって仕方ない。

解像度なんてどうでもいい、知りたいのは実質的な表示領域のサイズ。メディアクエリで指定する時のあのサイズ…。

ということで調べてみました。

 

結論から言うと、メディアクエリの指定は何も変えなくてよさそうです。横幅に関してはiPhone6世代から変わっていません。

実際の数値は以下の通りです。

  • iPhone8375px - 667px (W - H) 
  • iPhone8 Plus414px - 736px (W - H) 
  • iPhone X :  375px - 812px (W - H) 

ふむふむ。スマホ用のメディアクエリはiPhoneを基準にするなら最大414pxのままで良いということがわかりました。

ちなみに自分でも確認したい時はUIScreen.main.bounds.sizeというのを調べればいいそうです。早速購入したという方は実機で確認してみるといいかもしれません。

目次
自分の価値を生み出すWordPressテーマ、SWELL

【限定セール中】WEMOの筆者が開発したブログ向けWordPressテーマです!

- Thank you for reading. -

コメント

コメントする