CSS 媒体设备不适用

我不明白，为什么这不起作用:

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

    .contentBlockText {
        position: relative;
        display: inline;
        width: 100%;
        background: #f00;
    }

}

.contentBlockText {
    position: relative;
    display: inline;
    width: 66%;
    background: #fff;
}

结果始终显示框的宽度为 66%。也是我的三星 S9，它不会改变尺寸。我还尝试了不同宽度的最大宽度选项。同样的结果。你能看出问题所在吗？我在同一个样式表的其他位置使用了该机制并且它有效...

最佳答案

尝试更改规则 block 的顺序，将查询放在默认值之后。我遇到过类似的行为，这对我有用。

编辑: 我没有注意。您不能在内联元素上设置宽度或高度。只需将其设为内联 block 即可。应该没问题。

“内联元素的宽度是内容的宽度。内联元素的高度和宽度不能在CSS中设置。你不能在CSS中设置 block 级元素的高度和宽度。” https://web.stanford.edu/class/cs193x/lectures/05/block-inline

关于CSS 媒体设备不适用，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/53092809/