CSS @media(最小宽度)不适用于电话。

Question

我目前正在制作一个菜单侧边栏，当屏幕宽度超过568 to (足够大到同时显示内容和菜单)时，应该总是打开它，但是当屏幕在这个宽度以下时，它是可打开和关闭的。

代码：

@media(min-width:568px){
  .open-slide {display:none}
  .btn-close {display:none}
  .side-nav {width:250px;margin-top:80px;}
}

打开侧栏的.open-slide = Button

.btn-close = Button关闭侧栏(显然)

侧导航{宽度:250‘t；边距顶部:80’t；}更改边栏的标准宽度，使其可见，并将其边框向下移动，因为“关闭”按钮不再存在。

当我用浏览器测试这个时，一切都很好。但是当我用手机测试它的时候，侧边栏就好像屏幕和全电脑屏幕一样大。哪里出什么问题了？

TL;DR：

代码在我的电脑上工作，但在我的手机上不起作用，为什么？

Answer 1

您可能遗漏了HTML标题中的视图：

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