CSS 背景图片铺满浏览器,任何情况下都铺面整个浏览器

老白 10个月前 575浏览 0评论

CSS 背景图片铺满浏览器,拖动、上下拉背景图片不出界,下面分享下CSS:

背景图片不出界.png CSS 背景图片铺满浏览器,任何情况下都铺面整个浏览器 CSS学习

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>CSS 背景图片铺满浏览器,任何情况下都铺面整个浏览器</title>
</head>
<body>
<style>
 body {  
    margin: 0;  
    padding: 0;  
    height: 100%;  
    width: 100%;  
    background-image: url(test.jpg);  
    background-repeat: no-repeat;  
    background-size: cover;  
}
 .login {  
    height: 300px;  
    width: 400px;  
    border: 1px solid #f00;  
    position: absolute;  
    left: 50%;  
    top: 50%;  
    margin: -150px 0 0 -200px;  
}  
</style>
<div class="login"></div><!----红色框---->
</body>
</html>

发表评论
展开