CSS：媒体查询延迟

Question

我的网站上有一个错误，我怀疑媒体查询有问题。 某些样式如下：

.main {
      border:1px solid black;
}

@media screen and (max-width: 350px) {
   .main {
      border:1px solid red;
   }
}

（当然，这些只是示例，我的样式更复杂。）

当我直接打开宽度小于350像素的网页时，可以在应用媒体查询（border:1px solid black;）之前的1秒钟内看到原始CSS规则（border:1px solid red;）。在旧设备上（CPU的性能？）更明显。

但是，当我将浏览器的宽度更改为低于350px时，媒体查询会顺利应用。

问题：我该如何解决？

Answer 1

您是否尝试过使用媒体查询的最小和最大宽度？

请检查以下内容，

 <application
        android:theme="@style/AppTheme">

Answer 2

.main {
      border:1px solid red;
}

@media screen and (min-width: 350px) {
   .main {
      border:1px solid black;
   }
}