すべてのデバイスまたはブラウザーで同じ物理サイズにする必要がある画像を使用して Web サイトを構築しています。画像が iPhone5 の画面に完全に収まるとします。つまり、物理的なサイズは 3.49x1.96 インチ (対角 4 インチ) です。ラップトップのブラウザーで見る場合、サイズも 3.49x1.96 である必要があります。インチ(明らかに解像度が低いことに苦しんでいます)画面が小さいiPhone4では、画像の一部が切り取られることさえありました.
PPI/DPI を取得し、それに応じて調整する必要があると思います。つまり、デバイスに iphone5 の PPI/DPI がある場合は、画像のサイズを 50% に変更する必要があります。ただし、画面の解像度も考慮に入れる必要があるかどうかは少し混乱しています。これは、モバイル以外のデバイスで変更される可能性があるためです。誰か助けてくれませんか?
これをすべてのデバイスで機能させるには、どのようなアプローチがよいでしょうか?