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


.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: 随着页面的滚动轴背景图片不会移动



注:如若喜欢,欢迎转载,请在文章页面明显位置给出此文链接!
若您觉得这篇文章还不错请点击下右下角的推荐,有了您的支持才能激发作者更大的写作热情,非常感谢!


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM