1

您好，我创建了一个网站，3 周前媒体查询和一切正常，我休息一下。现在我再次测试该网站，媒体查询不起作用（是的，它只是搞砸了）。

这是我的媒体查询：

/* Media Queries */

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

    #ad-container, #ad, #adnum, #adnums, #adStxt, #footer {
        display: none;
    }

    #adtxtspecial {
    display: block;
    }

    #content {
    padding-left: 0px;
    }

    #project-logo {
    display: none;
    }
}

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

    #header {
        height: 100px;
    }
}

在文件的开头我得到了这个：

<meta name="viewport" content="initial-scale=1.0; maximum-scale=1.0; width = device-width;">

请尽快回答。

编辑：这些是我需要更改的元素的原始样式。

#ad-container {
  text-align: center;
}

#ad {
  width: 900px;
  height: 500px;
  margin-right: auto;
  margin-left: auto;
  display: block;
}

#adnums {
   padding: 2px;
   background-color: #f7f6f5;
   cursor: pointer;
}

#adnum {
   color: #dd4814;
   font-weight: bold;
}

#adStxt {
   font-size: small;
}

#adtxtspecial {
   display: none;
   text-align: center;
   font-size: 40px;
   color: #dd4814;
   font-weight: bold;
   padding-top: 100px;
   padding-left: 10px;
   padding-right: 10px;
}
4

2 回答 2

0

我能想到的问题是您使用的是内联样式。内联样式会覆盖 CSS 部分/文件中的样式属性。

这是一个例子

我添加了这个 CSS：

#content{
    padding-left:50px;
}

请注意，您不应使用具有相同 ID 的 2 个不同元素，但对于该示例，它可以工作并证明问题。

于 2013-07-21T16:37:10.480 回答
0

更好的做法是对这类事情使用类。看看将它们更改为类是否可以解决问题。

于 2013-07-21T17:42:08.940 回答