ausheng

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

先说一下我的配置:

浏览器:chrome

使用CSS:bootstrap(这个可能会影响到我们css的设置,所以还是提一下)

在设置背景图片的过程中,经常遇到背景图片不能按照自己所想的那样来自动适应屏幕,我也是尝试了很多种方法之后找到了一种适合我自身情况的设置方式。代码如下:

body {
   background-image: url("../images/backgroundImg2.jpg");
   background-position: center 0;
   background-repeat: no-repeat;
   background-attachment: fixed;
   background-size: cover;
   -webkit-background-size: cover;
   -o-background-size: cover;
   -moz-background-size: cover;
   -ms-background-size: cover;
 }

这样,就能成功的设置body的背景图片自动适应屏幕。
但是, 其他浏览器能不能兼容我还没去确认过,目前在chrome上面是可以用的。

ausheng

爱生活,爱编程

AUSHENG – BLOG

不要害羞,保持联系。我们喜欢结识有趣的人,结交新朋友。