7月更新・前月(6月)の人気記事トップ10 07/02/2024
- ( 01 – ) 【Labs】position:absoluteとwidth:100%を指定すると横幅の設定がうまくいかない場合の対処方法について
- ( 04 ↑) 【jQuery】入門2. jQueryをHTMLに組み込む
- ( 05 ↑) 【Mac】横画面で撮影した動画をYouTubeショート用にMacのiMovieで縦画面に編集する方法
- ( 02 ↓) 【Mac】macOSをHigh SierraからMontereyにアップグレード
- ( 03 ↓) 【Mac】Safariでソースコードを見る方法
- ( 10 ↑) 【jQuery】入門7. jQueryで新しいWindowを開く
- (圏外↑) 【GIMP】レイヤーをロック
- (圏外↑) 【Inkscape】InkscapeでCMYKカラーを表示する
- (圏外↑) 【jQuery】入門11. switch文による条件分岐
- ( 06 ↓) 【Labs】CSSだけでドロップダウンメニュー
【2023年9月】iPhone画面解像度まとめ
こんにちは(・∀・)
iPhone画面解像度のページを更新しました。
iPhone画面解像度まとめ
この一覧に掲載されている情報は2023年9月の時点でアップルストア オンラインで購入できる製品の情報です。
(対角)
Super Retina XDRディスプレイ
CSSピクセル 932 x 430
Super Retina XDRディスプレイ
CSSピクセル 852 x 393
Super Retina XDRディスプレイ
CSSピクセル 932 x 430
Super Retina XDRディスプレイ
CSSピクセル 852 x 393
Super Retina XDRディスプレイ
CSSピクセル 926 x 428
Super Retina XDRディスプレイ
CSSピクセル 844 x 390
Super Retina XDRディスプレイ
CSSピクセル 844 x 390
Retina HDディスプレイ
CSSピクセル 667 x 375
ハイライトされたCSSピクセルの数値でコーディングします。
iPhone 15 Pro Maxは横幅430px、
iPhone 15 Pro は横幅393px、
iPhone 15 Plus は横幅430px、
iPhone 15 は横幅393px、
iPhone 14 Plus は横幅428px、
iPhone 14 は横幅390px、
iPhone 13 は横幅390px、
iPhone SE は横幅375pxです。
画像等を作成する際はデバイスピクセルの数値を参考にしてください。
iPhone 15 Pro Maxは横幅430px x 3倍、
iPhone 15 Pro は横幅393px x 3倍、
iPhone 15 Plus は横幅430px x 3倍、
iPhone 15 は横幅393px x 3倍、
iPhone 14 Plus は横幅428px x 3倍、
iPhone 14 は横幅390px x 3倍、
iPhone 13 は横幅390px x 3倍、
iPhone SE は横幅375px x 2倍のサイズで画像を作ってCSSピクセルの大きさに縮小表示させると画像はキレイに表示されます。
しかし、ファイルサイズが大きくなり過ぎるので1.5倍位のサイズで画像を作っても良いのではないかと思います。
Apple iPhone 15 (128 GB) - ブルー
https://amzn.to/3w3bYBG
関連ページ
ブログ更新🌿
— Webデザインラボ (@webdlab) September 13, 2023
【2023年9月】iPhone画面解像度まとめhttps://t.co/ebWRrQhBFU