html - 媒体查询有问题，没有任何反应

Question

我使用这段代码在第二个 html 页面上进行了完美的媒体查询

@media only screen and (min-device-width: 200px) and (max-device-width: 1099px)  {
    .snebild img {
        width: 50%;
        max-width: 50%;
        right: 2%;
    }
    .title {
        margin-left: 4%;
        position: absolute;
        top: 10%;
    }
}

但在我的第二页上，我试图更改字体大小，使其在较低分辨率下看起来不错，但使用相同的代码只是更改为正确的类和 p 元素，但没有任何效果。

@media only screen and (min-device-width: 200px) and (max-device-width: 1099px)  {
    .introus p {
        font-size: 8px;
    }
}

这是HTML

<div class="introus">
    <h2>Main Title</h2>

    <h4>Second title</h4>

    <p>Text to change size on when using lower resolution such as Iphones</p>
</div>

Answer 1

我假设您是在桌面设备而不是移动设备上测试它。尝试将 min-device-width 更改为应该有效的 min-width 。

如果我错了，请纠正我。