媒體查詢不適用於移動設備，但在台式機上效果很好

Question

HTML頭

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

CSS媒體查詢-

@media handheld, screen 
  and (min-width: 200px)
  and (max-width: 399px){}

Answer 1

我不知道您為什么使用掌上電腦。

@media only screen and (min-width:300px) and (max-width :399px) { }

Answer 2

首先，大多數移動瀏覽器不支持handheld ，您可以從以下問題中了解更多信息： iPhone / Android瀏覽器是否支持CSS @media手持設備？

其次，你的斷點@media並不十分任何手機屏幕大小相匹配，在此網站列出媒體查詢標准的設備，你可以檢查： https://css-tricks.com/snippets/css/media-queries -對於標准設備/