媒体查询不支持 1024x768 系统分辨率

发布于 2024-12-10 20:42:04 字数 308 浏览 0 评论 0 原文

我使用媒体查询 CSS 应用了背景颜色：平板电脑为灰色，系统浏览器为蓝色。它运行良好。现在的问题是，当我将系统分辨率设置为 1024x768 时，平板电脑颜色 - 灰色也适用于我的系统浏览器，而不是蓝色。请建议我。

下面是我的CSS：

.Box{background-color:#709bd3;height:200px}

@media screen and (min-device-width:600px) and (max-device-width:1024px) {
.Box{background-color:#ccc}
}

原文

i have applied background color:gray for tablet, and blue color for my system browser with using of media queries css. It is working fine. Now the problem is, when i tured my system resolution to 1024x768, the tablet color - gray is applying to my system browser also instead of blue color. Please suggest me.

Below is my css:

.Box{background-color:#709bd3;height:200px}

@media screen and (min-device-width:600px) and (max-device-width:1024px) {
.Box{background-color:#ccc}
}

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

雪若未夕 2024-12-17 20:42:04

首先，请确保在每个语句末尾添加分号。

.Box {
background-color:#709bd3;
height:200px;
}

@media only screen and (min-device-width:768px) and (max-device-width:1024px) {
    .Box {
    background-color:#ccc;
    }
}

我还将 min-device-width 更改为 768px，这是 iPad 的最小值。

编辑 - 看起来您需要使用用户代理字符串。尝试按照以下步骤操作：

http://www.htmlgoodies.com/beyond/webmaster/toolbox/article.php/3888106/How-Can-I-Detect-the-iPhone--iPads-User-Agent.htm

For a start, make sure you include a semicolon at the end of every statement.

.Box {
background-color:#709bd3;
height:200px;
}

@media only screen and (min-device-width:768px) and (max-device-width:1024px) {
    .Box {
    background-color:#ccc;
    }
}

I also changed min-device-width to 768px, which is the iPad's minimum.

EDIT - Looks as though you'll need to use the user agent string. Try following this:

http://www.htmlgoodies.com/beyond/webmaster/toolbox/article.php/3888106/How-Can-I-Detect-the-iPhone--iPads-User-Agent.htm

回复收藏 0 原文

~没有更多了~