Question

为什么这个CSS在Opera mini中不起作用？

.gogogo{height:50px;width:100%;}
@media screen and (min-width:100px){
    .gogogo {background-color:red;}
}
@media screen and (min-width:320px){
    .gogogo {background-color:orangered;}
}
@media screen and (min-width:480px){
    .gogogo {background-color:orange;}
}
@media screen and (min-width:600px){
    .gogogo {background-color:yellowgreen;}
}
@media screen and (min-width:768px){
    .gogogo {background-color:green;}
}

HTML：

<div class="gogogo"></div>

JSFiddle，CSSDesk

我不只是问这个问题，因为this site在这方面工作得很好......也许他们使用javascript来检测分辨率和其他东西？（我试图在源代码中找到它，但我的搜索不成功。）

Answer 1

Opera Mini是一个瘦客户端，它接收Opera Server上预编译的“智能”映像（OBML）。当您输入地址时，手机上的瘦客户端会将其发送到Opera服务器，后者会向远程服务器发送真实的HTTP请求。然后Opera服务器接收响应，创建映像并将其发送回瘦客户端。所以本身没有css，html，js到达瘦客户端。只是OBML图像。因此，当您更改设备的方向时，您需要重新加载页面才能生效。这是在节省带宽（80％）和设备上的实时交互之间的权衡。

Opera mini中的媒体查询 - 显示不正确

1 个答案: