将媒体查询应用于元素

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代码