是否有在 CSS 媒体查询中使用物理屏幕宽度的解决方法?今天,有些手机的分辨率超过了桌面显示器的分辨率。但是,手机仍应显示移动布局,桌面应显示标准布局。
所以我不能像下面的示例那样依赖基于像素的查询。相反,我需要物理测量或像素密度测量。
@media screen and (min-width: 700px) {
}
由于我还没有通过我的研究发现这样的测量值,所以它们可能不存在。无论如何,这个问题通常是如何解决的?
最佳答案
嗯,对于初学者来说,CSS 像素是 an angular measurement并且在设备之间进行了适当的标准化。不完全是,但足以让这在大多数情况下不是问题。
我个人在 em
中测量媒体查询,以便它们与我的字体大小相关。我的意思是,人们访问网站通常是为了阅读网站上的文本,所以只要每行的字数合理,我就满意了。
您真的不应该使用物理(设备)宽度进行测量,因为用户界面元素可能会占用空间(或者根本无法全屏运行浏览器)。
关于css - 关于屏幕尺寸而不是分辨率的媒体查询,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19475907/