标头中的css3媒体查询不工作

我有两个样式表，一个用于移动设备，一个用于计算机。 默认情况下，我想使用我的移动工作表

我的标题检查：

 <link rel='stylesheet' media='all' href='css/mobile.css' />
 <link rel='stylesheet' media='screen and (min-width: 580px)' href='css/large.css' />

---

但当我在手机浏览器上查看时，我似乎仍然在使用我的大样式表！（iPhone4）

试着做如下事情： （矿山代码）

---

（这只是一个例子）

我的问题是iPhone似乎在调整内容大小

我用过：

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

…以防止在手机浏览器中重新调整大小

把这个标签放在头上，就在我的媒体查询之前。

---

现在媒体查询功能正常了。

你到底为什么这么说？什么是行为？请详细说明。。。

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