html - @media 查询不适用于所有规则

Question

我真的坚持这个，因为我的@media 查询适用于第一条规则，但不适用于它之后的任何内容。

例如，当屏幕低于设置宽度时，我让“subButton”消失，但我还需要将 h2 标题大小更改为 2.5em (当前在桌面上为 4.5em)。但是，在我的 iPhone 上查看时，只有 subButton 被媒体查询更改。

对我做错了什么有什么想法吗？

* 编辑 * 我已将目标代码包含在媒体查询中。我已经尝试了所有不同的类(class)，但仍然没有运气。非常感谢任何进一步的见解

/** Mobile **/
@media only screen and (max-width: 767px), only screen and (max-device-width: 767px) {
    #subButton
    {
        display:none;
    } 
    .primaryContainer h2 {
        font-size: 2.5em;
    }
}

HTML

<section class="contentContainer" id="primaryBackground">
        <div class="container">
            <div class="row">
                    <div class="col-md-8 col-md-offset-2 primaryContainer">
                            <h2>Get Rocket Ship Growth!</h2><br>
                            <p>Weekly Step by Step Growth Hacking<br>Guides & Actionable Insight</p>
                            <button><a href="#section2">Learn More &or;</a></button>
                    </div>
            </div>
        </div>
    </section>

Answer 1

这一定是由于特异性。我已经测试过了，它工作正常。但是，您缺少该 block 中的最后一个右括号。检查 .primaryContainer h2 并查看哪些样式处于事件状态。可能有一个额外的类或 ID 从某处被调用并应用于它。