如何在没有JavaScript的情况下检测屏幕分辨率？

Question

In case i want to check user's device by its resolution(ie 300x600px for mobile, 800x600px for tab, and 1024x768px for pc).

but, how can i get the user's screen resolution when their javascript is disabled?

or is there any other way to solve my problem?

Answer 1

您可以使用CSS媒体查询来应用针对某些屏幕分辨率和方向的CSS规则。

Answer 2

@media should do it

By your specs:

@media (max-width: 799px) {
  @import url("/uri/to/mobile.css");
}
@media (min-width: 800px) {
  @import url("uri/to/tablet.css");
}
@media (min-width: 1024) {
  @import url("/uri/to/desktop.css");
}

Answer 3

I dont think you need to create diffrent pages for eaxh reslolution juat use CSS media queries for adjust page according layout.

If you want diffrent page per resolution then you have to use some server side lib or function to detect browser resolution