我正在努力优化网站的响应能力。通常我通过使用媒体查询来解决这个问题。
问题在于，我基于devicePixelRation = 1设计并编写了scss，编写了媒体查询以定义较小屏幕的断点。
现在在极少数情况下，当使用devicePixelRatio> 1从设备访问站点时，一切看起来都会变大。
我想找到一种比使用更好的解决方案评级器
@media (-webkit-max-device-pixel-ratio: 2) {}
我正在考虑获取devicePixelRatio并将其用作除法器以缩放我需要的任何scss值。
在ts中获取（以某种方式）devicePixelRatio并将其传递到全局scss文件
$pixel-ratio: 1;
$main-title : (1em / $pixel-ratio) --- 1 / 1 = 1
$pixel-ratio:1.5
$main-title : (1em / $pixel-ratio) --- 1 / 1,5 = 0.666
我也在考虑另一种方法，因为显然不可能通过ts将变量传递给scss。 然后的想法是创建不同的全局scss变量文件，并根据给定的devicepixelratio加载正确的文件。
我希望有人对我的想法发表意见，并请原谅我在这篇帖子中写的任何兽交。
欢迎任何建议。