html - 屏幕分辨率的条件语句？

Question

我想使用条件语句附加不同的样式表:

if the clients resolution is <= 1024*768

我很确定这是可能的，但以前从未见过它的代码？

附言。我不是在寻找 JavaScript 解决方案

Answer 1

通常人们不会为屏幕分辨率“附加另一个样式表”，因为您可以在页面加载后调整浏览器的大小，更改分辨率，并且您不希望每次都加载文件。

这将在一个 CSS 文件中达到目的:

例如:

/* css as usual */
.this-class { font-size: 12px; }

/* condition for screen size minimum of 500px */
@media (min-width:500px) {

  /* your conditional / responsive CSS inside this condition */

  .this-class { font-size: 20px; }

}

当@media 查询条件为真时，这应该将字体大小更改为 20px，在这种情况下，屏幕超过 500px。

当您调整浏览器大小时，您会看到条件 CSS 规则自动生效，无需 JS。