首页 > 解决方案 > 为什么背景图像在移动设备上不会改变?

问题描述

html {
    margin: 0;
    padding: 0;
    background-image: url("./Images/mainPage.png");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: fixed;
}

@media only screen and (max-width: 750px) {
    html {    
        background-image: url("./Images/smalMainPage.png");
    }
}

没有“@media only...”的部分适用于屏幕尺寸小于 750 像素的设备。为什么会这样?

标签: htmlcss

解决方案


<meta name="viewport" content="width=device-width, initial-scale=1.0">

标签可能丢失?因为在 codepen 上工作:https ://codepen.io/dgknca/pen/REwKrV


推荐阅读