在body中没有元素把高度撑开的情况下,怎么设置背景图铺满全屏?

发布于 2022-09-03 13:52:40 字数 289 浏览 11 评论 0

html,body{
    background:url(../img/bg.jpg) center center no-repeat;    
}


经测试其他5.5寸以下的手机屏都能完整显示背景图
5.5的不行,页面底部会有30px的留白?

clipboard.png

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(9

土豪 2022-09-10 13:52:40
html,body {
    margin: 0;
    padding: 0;
    min-height: 100vh;
    background-size: cover;
}
终止放荡 2022-09-10 13:52:40
background-size:cover;
帅气称霸 2022-09-10 13:52:40
/*新增加此条样式*/
html,body{
    width:100%;
    height:100%;
}
回梦 2022-09-10 13:52:40
background-size:cover
background-position:center

background-size:cover;

图片本身不够宽高,用这个参数可以使图片满屏,就是会背景溢出窗口

半寸时光 2022-09-10 13:52:40

很久以前做WEBAPP封面的时候觉得@media all and (min-device-pixel-ratio: 16/9) {...} 不错,但是最终没有机会使用,可以使用多张图,长宽比无非也就16:9,4:3,或者变态魅族15:9,不过楼主,我没试过。。。

人间不值得 2022-09-10 13:52:40

background-size:cover;

べ映画 2022-09-10 13:52:40

width:100%; height:100%;

高度宽度撑开即可

贪恋 2022-09-10 13:52:40

建议了解一下background-size属性,https://segmentfault.com/a/11...,这是我写的对这个属性的解释,可以看一下,哈哈

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文