html自动适应屏幕代码,HTML5 body设置自适应全屏

用什么代码实现?不允许有白色底色产生,因为手机高度不一样

设计图要标准(750)确认是背景图(通屏底图)应用场景:移动端宣传页面或者活动页面

错误的写法:加到div中结合图片设置min-height,但是页面不会回弹

终极方案

html,body{

width:100%;

height:100%

}

body{

font-family: "华文细黑";

background:url("../img/Flyer-bg.png") no-repeat;

background-size: 100%;

}

一个hack方案解决垂直剧中问题

缓存

.parent{

width:200px;

height: 200px;

/* 以下属性垂直居中 */

position: absolute;

top: 0;

bottom: 0;

left: 0;

right: 0;

margin: auto;

background-color: #aaa;

}

111

其他方案

Document

20171214085954_shouye5.jpg

清除浮动

.float-left {

float: left;

}

.float-right {

float: right;

}

.clear-fix:after {

display: table;

content: '';

clear: both;

}

到此这篇关于HTML5 body设置自适应全屏的文章就介绍到这了,更多相关HTML5自适应全屏内容请搜索脚本之家以前的文章或继续浏览下面的相关文章,希望大家以后多多支持脚本之家!

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值