如何使div背景图像响应

Question

如何使这个图像响应

HTML:

<section id="first" class="story" data-speed="8" data-type="background">
    <div class="smashinglogo" id="welcomeimg" data-type="sprite" data-offsetY="100" data-Xposition="50%" data-speed="-2"></div>
</section>

CSS:

#first .smashinglogo {background: url(../images/logo1.png)  50% 100px no-repeat fixed;}

Answer 1

使用background-sizeproperty to value 100% auto来实现您正在寻找的东西.

例如,

#first .smashinglogo{
   background-size:100% auto;
}

希望这可以帮助.

PS:根据您上面的代码,您可以删除fixed并添加100% auto以实现输出.

Answer 2

尝试添加 background-size:cover

.smashinglogo {background: url(../images/logo1.png)  50% 100px no-repeat fixed;
  background-size: cover;
  height:600px
}

查看本教程的详细文章.