检查css中的用户分辨率？答案

【问题标题】：Check users resolution in css?检查css中的用户分辨率？
【发布时间】：2011-03-05 23:50:47
【问题描述】：

是否可以根据用户的分辨率进行操作？

【问题讨论】：

当然。 google.com/search?q=Check+users+resolution+in+css
我不明白为什么人们对上面的评论 +1。它不仅聪明而且无益，而且是错误的！ @Casey 如果有办法在 css 中做到这一点，让我们看看你的答案。
是的，评论基本上是错误的。但是，如果您需要根据用户的分辨率行事，则可能是您的代码有问题。
实际问题询问是否可以根据屏幕分辨率进行操作。根据用户的屏幕分辨率，您可以有不同的样式表和不同的布局（参见 kennebec 的回答），所以我相信“是”是这个问题的正确答案。
@Casey 我猜你是对的。出于某种原因，我认为它是在询问您是否可以在 css 中 get 屏幕资源。你仍然应该看到meta.stackexchange.com/questions/8724/…

【解决方案1】：

css3 媒体查询将允许您应用样式表或@media 规则根据客户的大小，以及其他属性。

它们不会在不兼容的浏览器中回退，因此它们不适合一般使用，但如果你还年轻，可能值得学习它是如何完成的。

当文档显示在大于 800 像素宽的屏幕上时，将样式表应用到文档：

<link rel="stylesheet" media="screen and (min-device-width: 800px)" >

在任何宽度小于 400 像素的设备上显示文档时应用样式表：

<link rel="stylesheet" media="all and (max-device-width: 400px)" >

此媒体查询表示屏幕和手持设备的规则，如果视口宽度大于20em。

@media handheld and (min-width: 20em), screen and (min-width: 20em) { ... }

“em”值与根元素的字体大小有关。

【讨论】：

【解决方案2】：

不使用 CSS，不。但是对于 JS，当然可以。

if (window.screen.width <= 800 && window.screen.height <= 600) {
    //do something();
}

【讨论】：

【解决方案3】：

您不能在标准 CSS 中做到这一点。也许在（仅）IE浏览器中会没问题。

或者你可以使用 JavaScript。

【讨论】：

【解决方案4】：

您无法使用 CSS 检查分辨率。但是你可以做出流畅的设计。

看看Little boxes 了解一些很棒的初学者。

Grz，克里斯。

【讨论】：