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)