Question

我为特定的div设置了最大宽度为812px的媒体查询，但是由于某些原因，这会影响桌面。

我尝试将媒体查询更改为“仅媒体屏幕”。我还删除了浏览器历史记录，缓存和cookie，因为这可能会造成一些干扰。

CSS桌面代码

.contact-footer{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
  padding: 30px;
  background:#90634b;
  color:white;
  bottom:0;
}

CSS媒体查询

@media only screen and (max-width: 812px) {

.contact-footer{
padding-bottom: 150px;
margin-bottom: 20px;
width:315px;
}

}

正在做的是将背景减半（实际上应该在移动版本中，而不是台式机，但也应该在台式机中进行）。

谢谢

Answer 1

尝试将其设置为：

@media screen and (max-width:998px) {
    .contact-footer{
      padding-bottom: 150px;
      margin-bottom: 20px;
      width:315px;
   }
}

Answer 2

仅供参考，

CSS媒体查询代码必须首先放在CSS文件中，然后才是台式机CSS。

媒体查询会影响桌面

2 个答案: