响应网站适用于iPhone，但不适用于Galaxy S2

我遇到了我正在制作的第一个网站的问题。我正在制作一个响应式网站，该网站正在使用我已测试过的桌面以及我的iphone 6和其他iPhone（4/5/5c）。但我婆婆的三星Galaxy S2似乎没有正确显示该网站。对我来说，它看起来像显示它的桌面版本，而不是执行我要求它做的@media查询。响应网站适用于iPhone，但不适用于Galaxy S2

这是我的网页的标题：

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

而且这是在我的CSS文件：

@media only screen and (min-device-width : 200px) and (max-device-width : 800px) and (orientation : portrait)

，这是网站： www.soscharcoalseafood.com.au/测试/

我没有努力的目标只是三星，我想使它在所有手机只是一个@media规则。我可能最终会为平板电脑制作一个，但是我想先清理手机。一切都围绕手机100％宽度属性。

我也尝试了许多不同的meta标签，但没有注意哪些我已经使用了很抱歉。

我环顾四周，找不到太多所以任何帮助是极大的赞赏！

[编辑1]

如果你愿意，你可以去http://www.soscharcoalseafood.com.au/test/css/stylesheet.css和查找整个CSS。手机@media正处于底层。有一个宽度为1000px的桌面重新定位的东西，所以忽略它。

[编辑2] 我的母亲在法律的S2截图 http://imgur.com/weZUQQG

来源

2015-08-17 weedrummerman

如果您正在定位所有手机，为什么不使用'@media（max-width：640px）{}' – odedta

如果您不担心页脚和页眉内容的位置，请更改#body的宽度并将其设置为100％它会工作。但根据该决议进行媒体查询。 –

试过'@media（max-width：640px）'，仍然没有工作。 #body已经有宽度：100％。 – weedrummerman

的原因是三星设备在纵向和横向模式的不同分辨率和苹果一直在自己的设备相同的分辨率。

试试这个媒体查询银河S2：

@media only screen 
 
and (min-device-width : 480px) 
 
and (max-device-width : 800px) 
 
and (orientation : landscape) { 
 

 
} 
 

 
@media only screen 
 
and (min-device-width : 480px) 
 
and (max-device-width : 800px) 
 
and (orientation : portrait) { 
 

 
}

来源

2015-08-17 07:06:56 WisdmLabs

以及这是不是他正在寻找..因为我已经知道如何使用媒体查询..请与更好的解决方案..对 –

对不起，已经尝试.. – weedrummerman

好吧。将尝试其他方法... – WisdmLabs

嗯，你可能想看看动员http://mobile1st.com它可以让你在最流行的设备测试（实际设备，不是模拟器）包括这些：

Google Nexus 7 HTC One M8 iPhone 5c iPhone 5s iPhone 6 iPhone 6加 iPod touch的产品iPad Air iPad的迷你的Kindle Fire HDX 7 联想A850 LG G2 三星Galaxy S5 三星Galaxy S6边缘三星Galaxy Tab Pro的8.4

没有S2在这一刻，但可能值得在那里快速渲染，看看它是如何呈现整体。

来源

2015-08-20 00:53:16 Dan

谢谢！ A850没有工作..即时通讯认为这可能是一个Android的问题！ – weedrummerman

您可以看到我们正在查看的这个页面，该页面现已呈现在顶级移动设备上，包括A850： https://app.mobile1st.com/mobilizer/#/view/ODYD – Dan

响应网站适用于iPhone，但不适用于Galaxy S2

回答

相关问题