@media没有设定新的保证金

Question

这是我的基本风格

#logo {
    position: absolute;
    background: url('imgs/logo.png');
    width: 739px;
    height: 195px;
    margin: -291px 0 0 133px;
    z-index: 5;
    pointer-events: none;
}

我想基于媒体将margin-left更改为其他内容。例如，宽度100px，但它不起作用。

@media (min-width: 1440px) {

    .bc {
        padding: 0;
        margin: 0 auto;
        width: 1150px;
    }

    .content_table {
        width: 1150px;
    }

    #logo {
        position: absolute;
        background: url('imgs/logo.png');
        width: 739px;
        height: 195px;
        margin: -291px 0 0 233px;
        z-index: 5;
        pointer-events: none;
    }
}

Answer 1

在您的评论中，第一条规则（保证金为133px的规则）位于@media区块中的规则之后。

由于两者对规则都有相同的选择器，因此css文件中的顺序很重要。

这就是为什么最后一条规则（带有133px的规则）总是覆盖@media区块中的规则。

您应该将不在@media块中的所有规则放在css文件的开头，并在这些规则之后添加@media块。

Answer 2

@media screen and (min-width: 1440px) {
    #logo {
    }
}

min-width: 1440px很多。你确定你没有尝试检查最大宽度吗？