CSS 媒体屏幕和移动问题

Question

在我的网站上，我使用标准 css 来申请所有内容，

除外

@media (max-width: 480px) {

如果我的 screen/browser 等于或小于 480，它会使用该媒体下的任何内容。

但我的问题是它在我的 iphone (iphone 5S) 上不起作用。 我能够发现 @media (max-screen-width: 480px) { 可以工作，但是我的浏览器宽度 480 不适用于它。

我搜索了不同的网站，但我看到他们的整个 css 文件，他们只使用 max-width，并且在访问他们的页面时，它在我的 phone.

问题：我怎样才能轻松做到它同时适用于浏览器和 screen/mobile？

Answer 1

只需将此添加到您的 head 标签中

<meta name="viewport" content="width=device-width">

和css：

@media screen and (max-width: 480px) {
   // code goes here
}