时间戳

首页 > 解决方案 > 媒体查询未申请所需的屏幕尺寸

css - 媒体查询未申请所需的屏幕尺寸

问题描述

我正在为某些移动屏幕创建移动设计，所以我想将我的样式应用于 275px 宽到 812 的屏幕。目前由于某种原因，为此媒体查询定义的样式从 303 到 812 宽度应用，但它们没有任何效果。我的媒体查询对于我想要实现的目标是否错误？这是它的外观：

@media screen and (min-width:275px) and (max-width:812px) {}

这是我在 html 中的视图端口行：

    <meta name="viewport" content="width=device-width,initial-scale=1.0">

标签： cssmedia-queries

解决方案

你的代码看起来不错；它在这里工作得很好。我不确定您要实现什么，但媒体查询在指定的最小宽度以下（或在本例中为 275 像素以下）将无法工作。它将绑定到您设置的约束。

@media screen and (min-width:275px) and (max-width:812px) {
  body {
    background: blue;
  }
}

推荐阅读