Question

我有一个使用像素设计的网站...问题是它是在高分辨率的屏幕上开发的，当你从小分辨率设备访问它时，它看起来很奇怪......

所以我的问题是：

如果分辨率小于x给定值，是否可以使用javascript或任何其他形式的前端语言更改为页面上所有元素的样式（自动检测它们），从基于像素到基于百分比（一切......从大小到填充......等等）？

聚苯乙烯。我知道如何获得屏幕分辨率......

Answer 1

示例：

@media all and (max-width: 699px) and (min-width: 520px), (min-width: 1151px) {
    body {
        background: #ccc;
    }
}

Answer 2

使用CSS媒体查询解决问题？如果用户启用了JS，则不受约束。并且不会像JS那样减慢加载时间。

您可以根据分辨率使用指定的CSS行。

示例：

@media all and (max-width: 699px) and (min-width: 520px) {
  #container {
      width: 650px;
  }
}