时间戳

首页 > 解决方案 > CSS 媒体设备不适用

css - 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，它不会改变尺寸。我还尝试了不同宽度的最大宽度选项。结果相同。你能看出问题吗？我在同一个样式表中的其他位置使用了该机制，它可以工作......

标签： cssmedia-queriesscreen

解决方案

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

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

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

推荐阅读