手机端背景图片撑满整个屏幕

Posted xmlearning

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了手机端背景图片撑满整个屏幕相关的知识,希望对你有一定的参考价值。

html设置一个空div,用来放置背景图片。

<body>
    <div class=“main”></div>
</body>

(1)方法一:高度100%

html,body{
    margin:0;
    height:100%;
}
.main{
    height:100%;
    background:url(‘./bg.png‘) no-repeat ; 
}
           

(2)方法二:高度100vh

.main{
    height:100vh;
    width:100vw;        
}    

 

以上是关于手机端背景图片撑满整个屏幕的主要内容,如果未能解决你的问题,请参考以下文章

让div撑满整个屏幕的方法(css)

让div撑满整个屏幕

片段布局不覆盖整个屏幕

jQuery 判断终端是IOS还是Android / jQuery处理背景图片不能撑满屏幕

首页背景图片在PC端有显示,在手机端不显示的解决方法

css 图片铺满整个div