在响应式设计方面，您如何处理高分辨率手机，例如 Galaxy S4? [英] In terms of responsive design, how do you handle high resolution phones, such as the Galaxy S4?

问题描述

过去，您会使用基于像素宽度的媒体查询来确定最终用户将获得什么显示.但是，当您使用分辨率更高的设备(例如 Galaxy S4 (1080x1920))时，这不起作用/不会起作用.

Historically, you'd use media queries based of pixel width to determine what display the end user will get. However, that doesn't/won't work when you are using a higher resolution device such as a Galaxy S4 (1080x1920) resolution.

你是如何处理的?

推荐答案

是什么让您认为媒体查询不起作用?

What makes you think media queries won't work?

显然，Galaxy S4 的 CSS 像素比为 3.0，因此，虽然其物理分辨率为 1080x1920，但其 CSS 分辨率仍为 360x640 - 类似于 Galaxy S3.

Apparently, Galaxy S4's CSS pixel ratio is 3.0, therefore, while its physical resolution is 1080x1920, its CSS resolution is still 360x640 - similar to Galaxy S3.

还有测试像素密度的媒体查询.它们可以帮助您向高分辨率设备提供高分辨率图片或矢量图形.

There are also media queries that test for pixel density. They may help you to serve high-res pictures or vector graphics to hi-dpi devices.

http://en.wikipedia.org/wiki/List_of_displays_by_pixel_density#Samsung

http://bjango.com/articles/min-device-pixel-ratio/

另外，看看这篇文章:

http://www.html5rocks.com/en/mobile/high-dpi/

很棒的屏幕规格数据库

http://screensiz.es/phone

这篇关于在响应式设计方面，您如何处理高分辨率手机，例如 Galaxy S4?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！