iphone - CSS 媒体查询 - 无法使其正常工作

Question

我有以下 CSS，包括针对 iphone 用户的媒体查询，但似乎不起作用:

body
{
background: url('background.png') no-repeat center center fixed;
background-size:100%;
}

#tab
{
width:30%;
height:60%;
position:fixed;
background: url('tab.png') no-repeat center center fixed;
background-size:33%;
top:20%;
left:35%;
opacity:0.7;
}

@media only screen and (max-device-width: 480px) 
{
body
{
background:#1589FF;
}

#tab
{
width:30%;
height:60%;
position:fixed;
background: url('tab.png') no-repeat center center fixed;
background-size:33%;
top:20%;
left:35%;
}
}

正常的 CSS 工作正常，但当切换到 iphone 时设计不会改变。谁能建议为什么上面的媒体查询似乎不起作用？我错过了什么吗？

Answer 1

改为:

@media only screen and (max-device-width: 480px) 

尝试:

@media (max-width: 480px)

OR

 @media only screen and (max-width: 480px)