CSS background-size填充父级

Question

我有一个div，我想使用固定的背景。我也使用背景大小的封面，以便从bg图像中获得最佳效果。 麻烦的是背景图像的缩放就好像是要覆盖div的父级一样。不是div本身。有什么方法可以解决这个问题吗？

.panel-image {
  height:100vh;
  width:50%;
  background-size:cover;
  background-attachment:fixed;
  background-position:center;
  background-image:my-image.jpg;
}

.parent{
  height:100vh;
}

这是一个在线示例。面板图像div是正方形，源图像也是如此，但图像仍然被严重裁剪，就像面板图像div更宽：

http://jsbin.com/siweloxebe/edit?html,css,output

Answer 1

这是因为您已将子div的高度设置为与父级相同。

我玩过你的代码here，看起来很好，或者我可能误解了你的问题