响应式CSS不起作用

Question

你好，堆栈溢出的人，我有一个问题。 我对低分辨率的响应式CSS不起作用，这是一个例子。

@media (min-width: 320px) and (max-width: 580px) {
.post_wrap_bg {
width: 460px;

height: 460px;
}
}
@media (min-width: 10px) and (max-width: 320px) {
.post_wrap_bg {
width: 360px;
height: 360px;
}
}

＆gt; 320不起作用，我可能做错了什么？

Answer 1

你有一个错字：

widht: 460px;

应该是

width: 460px;

修复它，它将按预期工作。

Answer 2

你应该这样试试，

@media (min-width: 321px) and (max-width: 580px) {
  .post_wrap_bg {
    width: 460px;
    height: 460px;
  }
}

@media (min-width: 10px) and (max-width: 320px) {
  .post_wrap_bg {
    width: 360px;
    height: 360px;
  }
}