Question

所以，我遇到了一个我似乎无法弄清楚原因的问题。

我有一些CSS文件：

1）styles.css - 包含大部分网页的样式。

2）overlay.css - 包含我的叠加层的样式。

3）media.css - 包含所有媒体查询。

到目前为止，一切都很好，我的页面响应性很强。但是，出于某种原因，我无法使用我的叠加层进行媒体查询。这是我在文件overlay.css中的叠加层CSS：

#aboutus {
    position: fixed;
    background-color: white;
    left: 50%;
    top: 50%;
    width: 800px;
    height: 450px;
    margin-left: -400px;
    margin-top: -225px;
    border-radius: 20px;
    z-index: 9999;
}

这是我在media.css中的媒体查询：

@media screen and (max-width: 700px) {
    #aboutus {
        background-color: red;
    }
}

目前这个查询没有任何效果。奇怪的是，如果我将查询放在overlay.css中的代码下，它确实可以100％工作。

为什么会这样？

感谢。

Answer 1

你如何加载你的CSS？你的媒体css应该在风格和时间之后。 overlay.css

媒体查询无法正常工作

1 个答案: