第一种方式
*注意将html也设置全屏
html 和css
<!DOCTYPE html>
<html>
<head>
<title>全屏展示</title>
<style type="text/css" media="screen">
html,body,div{
height: 100%;
width: 100%;
}
div{
background: url(h-login.png) no-repeat;
background-size: cover;
}
</style>
</head>
<body>
<div>
<input type="button" name="" value="">
</div>
</body>
</html>
遇到的问题
在页面所有元素的外围加div 并且设置 html body 高度 总是会出现一些问题
（比如我遇到的
1.有 当设置html body 100%之后会出现 页面其他内容会有问题
2.在页面所有元素的外围加div 时，假如打开控制台再关闭之后 页面总是不会重新刷新 填充整个body ，然后刚才打开可控制台的区域会是白色，用户体验不好
）
第二种填充在body上面
我个人心得当做全屏背景的时候 也可以填充在body上面 ，暂时没有出现什么问题（后续出现问题会更正）
html
<!DOCTYPE html>
<html class="v-prev-wrap">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title></title>
<link rel="stylesheet" href="css/v-global.css">
</head>
<body class="v-prev-bg"></body>
<html class="v-prev-wrap">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title></title>
<link rel="stylesheet" href="css/v-global.css">
</head>
<body class="v-prev-bg"></body>
css
.v-prev-wrap {
height: 100%;
width: 100%;
}
.v-prev-bg {
height: 100%;
width: 100%;
background: #dff5fe url(../images/v-backprev-bg.png) no-repeat;
background-size: 100% 100%;
}
height: 100%;
width: 100%;
}
.v-prev-bg {
height: 100%;
width: 100%;
background: #dff5fe url(../images/v-backprev-bg.png) no-repeat;
background-size: 100% 100%;
}
1230
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
