@media屏幕无效。我能做什么？

Question

我的宽度为200px，高度为100px。我想用@media调整此div的大小。但是@media不起作用。那我该怎么办？

.abc{
  display:block;
  width:200px;
  height:200px;
}
@media (max-width: 752px) and (min-width: 1024px){
  .abc{
     width:500px; 
     height:500px;
  }
}

Answer 1

这种情况永远不会成真。试试(min-width: 752px) and (max-width: 1024px)或(max-width: 752px) or (min-width: 1024px)（取决于您想要达到的目标）。

Answer 2

您已将最大宽度设置为752像素，将最小宽度设置为1024像素。交换那些。现在你拥有它，这样你的媒体设备必须小于753，同时大于1023。

Answer 3

@media (min-width: 752px) and (max-width: 1024px){
  .abc{width:500px; height:500px;}
}

你的最大和最小交换