html - 视差效果 CSS？

Question

我正在尝试使用 css 创建一个简单的视差效果，我有以下 code这创造了我正在寻找的效果，但它似乎放大了图像，所以我的图像的一半在 Angular 落被切断了。我怎样才能修改我所拥有的，以使其保持图像的实际大小？

<div id="slide4" class="slide" data-stellar-background-ratio="0" data-slide="4"> </div>
    <div id="slide2" class="slide" data-stellar-background-ratio="0.5" data-slide="2"> </div>

#slide4 {background-image: url("http://2.bp.blogspot.com/-m95Wunj4M-g/T8zFSAFdh4I/AAAAAAAAEhg/y9W8e-Iu4WQ/s1600/Flower-wallpaper-32.jpg");
background-size: contain;
float: left;
margin-top:20px;
height: 450px;}

.slide {background-attachment: fixed;
height: 100%;
position: inherit;
width: 100%;}

Answer 1

尝试

background-size: cover;

正如您在 this fork 中看到的那样你的 fiddle