关于全屏背景图片随屏幕大小自动适应方法

.background-pic{
background: url(../images/login/background.jpg) no-repeat center center;
background-size:cover;
background-attachment: fixed;
width: 100%;
height: 100%;
position: fixed;
top:0;
left:0;
right:0;
bottom:0;
}

<div class="background-pic"></div>

background-size:cover;  //把背景图像扩展至足够大,以使背景图像完全覆盖背景区域。背景图像的某些部分也许无法显示在背景定位区域中。

background-attachment: fixed; //fixed: 随着页面的滚动轴背景图片不会移动



注:如若喜欢,欢迎转载,请在文章页面明显位置给出此文链接!
若您觉得这篇文章还不错请点击下右下角的推荐,有了您的支持才能激发作者更大的写作热情,非常感谢!
posted @ 2016-02-21 10:59  Caraxiong  阅读(6056)  评论(0编辑  收藏  举报