媒体查询不适用于所有android设备
我真的希望这个问题没有得到回答,因为我在任何地方都找不到它。。。我有一个网站,使用媒体查询来显示不同的数据,如果它是一个移动或不是。我还有一个移动应用程序,带有一个调用该站点的webview。它适用于所有iOS设备,但仅适用于某些Android设备。。。有些安卓设备没有在网络视图中实现媒体查询吗 以下是我的CSS媒体查询:媒体查询不适用于所有android设备,android,ios,css,mobile,media-queries,Android,Ios,Css,Mobile,Media Queries,我真的希望这个问题没有得到回答,因为我在任何地方都找不到它。。。我有一个网站,使用媒体查询来显示不同的数据,如果它是一个移动或不是。我还有一个移动应用程序,带有一个调用该站点的webview。它适用于所有iOS设备,但仅适用于某些Android设备。。。有些安卓设备没有在网络视图中实现媒体查询吗 以下是我的CSS媒体查询: @media only screen and (min-device-width : 320px) and (max-device-width : 568px) and
@media only screen
and (min-device-width : 320px)
and (max-device-width : 568px)
and (orientation : portrait) {
#mobileBody { display:inline; }
#header, .wrapper, #footer { display: none; }
body { background:none; background-color:black; }
.mobileLogo { width: 85%; margin:50% auto 0; }
.mobileLogo a img { width: 100%; }
.mobile_fb_login { width: 50%; margin:10% auto 0; }
.mobile_fb_login a img { width: 100%; }
}
@media only screen
and (min-device-width : 320px)
and (max-device-width : 568px)
and (orientation : landscape) {
#mobileBody { display:inline; }
#header, .wrapper, #footer { display: none; }
body { background:none; background-color:black; }
.mobileLogo { width: 85%; margin:10% auto 0; }
.mobileLogo a img { width: 100%; }
.mobile_fb_login { width: 50%; margin:10% auto 0; }
.mobile_fb_login a img { width: 100%; }
}
@media only screen
and (min-device-width : 321px) and (max-device-width : 568px) {
#mobileBody { display:inline; }
#header, .wrapper, #footer { display: none; }
body { background:none; background-color:black; }
.mobileLogo { width: 85%; margin:10% auto 0; }
.mobileLogo a img { width: 100%; }
.mobile_fb_login { width: 50%; margin:10% auto 0; }
.mobile_fb_login a img { width: 100%; }
}
@media only screen
and (min-device-width : 569px) and (max-device-width : 767px) {
#mobileBody { display:inline; }
#header, .wrapper, #footer { display: none; }
body { background:none; background-color:black; }
.mobileLogo { width: 85%; margin:40% auto 0; }
.mobileLogo a img { width: 100%; }
.mobile_fb_login { width: 50%; margin:10% auto 0; }
.mobile_fb_login a img { width: 100%; }
}
@media only screen
and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait ) {
#mobileBody { display:inline; }
#header, .wrapper, #footer { display: none; }
body { background:none; background-color:black; }
.mobileLogo { width: 85%; margin:40% auto 0; }
.mobileLogo a img { width: 100%; }
.mobile_fb_login { width: 50%; margin:10% auto 0; }
.mobile_fb_login a img { width: 100%; }
}
@media only screen
and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {
#mobileBody { display:inline; }
#header, .wrapper, #footer { display: none; }
body { background:none; background-color:black; }
.mobileLogo { width: 85%; margin:10% auto 0 !important; }
.mobileLogo a img { width: 100%; }
.mobile_fb_login { width: 50%; margin:10% auto 0; }
.mobile_fb_login a img { width: 100%; }
}
如果可以,请提供帮助:-)您知道哪些android设备/浏览器不工作吗?t移动mytouch、三星galaxy s4和三星galaxy s2不工作。。。但GalaxyS3和S1以及我的Android模拟器都做到了……一些Android浏览器和可能的网络视图以一种为媒体查询创建虚假值的方式缩放页面。你能发布你的视口元标记吗?我的元标记是
可以缩小范围。。。当你说它“不工作”时,你的意思是它加载了整个站点而不是移动站点,还是它加载了移动站点,但媒体查询没有正确应用?我认为这可能与屏幕密度有关。