@media：如果samsung galaxy s4是1920x1080？

<link rel="stylesheet" media="only screen and (max-width:1280px)" href="css/article1280.css">

我正在编码我的响应CSS中，我意识到三星Galaxy S4智能手机的屏幕分辨率为1080x1920-我的23“显示器是1920x1080。一个分辨率为320x480的iPhone 3，这是我认为所有智能手机都在左右左右，800像素宽以下），所以我有点困惑。我该如何创建一个智能手机的移动网站与屏幕分辨率？1080×1920的@media：如果samsung galaxy s4是1920x1080？

来源

2013-06-04 user2441996

您的网站在目前的形式下无法使用吗？ – Blender

非常有用，但我想让所有的导航都变得更大更容易使用，并且将所有内容都缩小到单列，如果它将在手持设备中。 – user2441996

您使用视口元标记吗？如果没有它，媒体查询将不会有任何效果。 –

一些媒体查询，你可能会发现在这种情况下有用的是：

@media screen and (orientation: portrait | landscape) { ... } 

@media screen and (device-aspect-ratio: #/#) { ... }

来源

2013-06-04 17:13:21 skzryzg

使用@media screen and (max-device-width: your dimension here)。

来源

2013-06-04 18:35:19 Daniel

如果这有效，请接受它作为答案。 – Daniel

为什么使用设备宽度？如果有人在较小的浏览器窗口中查看，则尽可能以最佳方式显示它是有意义的 – mcdonaldjosh

银河S4报告360像素X 640像素到浏览器

纵横比9/16

像素比例3

@media screen and (max-device-width: 360px) 

@media screen and (-webkit-min-device-pixel-ratio: 3) 

@media screen and (device-aspect-ratio: 9/16)

来源

2013-07-25 18:59:25

在GS4设计时它呈现为常规宽屏除非您在标题中使用视口标记。我发布了我用来使其响应的示例@Samsung Galaxy S4 Responsive Design @media

来源

2014-07-03 00:27:03

确保您的头部有视口元标记。像这样：

<meta name="viewport" content="width=device-width, initial-scale=1.0">

这告诉用户代理考虑像素密度并相应地重新调整比例。所以你的1080像素宽度的三星Galaxy S4将会像一个360像素宽的屏幕。

来源

2015-12-01 23:30:34 chasmani

经过测试和工作！

@media screen and (-webkit-min-device-pixel-ratio: 3.0) and (max-width: 1080px), screen and (max-width: 480px)

来源

2016-02-25 06:43:27

@media：如果samsung galaxy s4是1920x1080？

回答

相关问题