bootstrop设置背景图片自适应屏幕

时间:2023-03-10 01:25:27
bootstrop设置背景图片自适应屏幕
如果不用bootstrop框架,想让背景图片自适应窗口大小,可以这样做:
<style type="text/css">
html{height: %;}
body.aa{height: auto;
background: url(login-background.png) no-repeat center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
color: rgba(, , , .)}
</style>
bootstrop中
css中编辑此样式:
.bg {
background:url(图片地址) no-repeat center;
background-size:contain;
}

然后在你的div里引用这个样式就行了:

<div class="row bg">
使图片不随滚动条滚动,即固定不动则加fixd:
.bg {
background:url(图片地址) no-repeat center fixed;
background-size:contain;
}