如何以 90% 的页面缩放级别编写媒体查询

Posted 2023-03-28

【中文标题】如何以 90% 的页面缩放级别编写媒体查询

【英文标题】：How to write media query at 90% page zoom level

【发布时间】：2020-09-04 04:11:47

【问题描述】：

只有当 Chrome 上的页面缩放级别降低到 90% 时，我才会面对彼此重叠的文本。

试过了

@media all and (min-width: 397px) 
    .add-list li float: left; display: block; width: 50%;

但是使用 397px 指定媒体查询条件会影响跨浏览器的其他缩放级别的行为

谁能建议我如何编写媒体查询仅用于 90% 的页面缩放？

是否可以根据像素比率（在 90% 模式下）对媒体查询进行编码？

【参考方案1】：

您可以将 '90vw' 代替 397px，这基本上意味着 90% 的视口宽度

【参考方案2】：

通常我们不会为不同的缩放级别编写媒体查询。请参考 Stack Overflow 答案 - Media Queries for Different zoom Levels of Browser