时间戳

首页 > 解决方案 > 当我添加解析条件时，我的媒体查询不起作用，我该怎么办？

css - 当我添加解析条件时，我的媒体查询不起作用，我该怎么办？

问题描述

我一直在为我参与的比赛开发一个网站，并为我的网站添加一些响应能力，我决定使用媒体查询。

我尝试使用各种不同的代码来为我的媒体查询分配分辨率，但它们都不起作用。我目前使用的是 Mac Book Pro 视网膜。

@media screen and (min-device-width: 1200px) and (-webkit-min-device-pixel-ratio: 2) and (min-resolution: 192dpi) {

提供的代码不起作用，但是当我删除最小分辨率时，它工作得很好。我不确定没有它是否会在将来出现某种问题，因为到目前为止我咨询过的每个网站都有某种最低分辨率标准。

标签： cssmedia-queriesscreen-resolution

解决方案

我相信问题可能是 and between (-webkit-min-device-pixel-ratio: 2)and(min-resolution: 192dpi)必须变成(-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi)

我希望这有帮助！

这是一个关于视网膜显示的 css-tricks 教程，可能会有所帮助：https ://css-tricks.com/snippets/css/retina-display-media-query/

推荐阅读