將媒體查詢應用於元素

Question

嘗試將媒體查詢應用於某個特定的div，但沒有任何事情發生。

<style> 
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) { 
.rating { 
     margin: auto; 
    } 
</style> 

Answer 1

看來你已經錯過了}後.rating

<style> 
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) { 
.rating { 
     margin: auto; 
    } 
} /* <-- this one you missed */`enter code here` 
</style> 

此外，如果它不是設備，您可以嘗試改變min-device-width到min-width同爲最大寬度。

也相應檢查設備的分辨率和不忘記補充meta標籤