Question

当我尝试使用具有固定位置的background-size：cover属性时，我的图像变得太大而且被裁剪。我希望它与原始图像的大小相同，但我无法弄清楚这一点。我试图保持图像的影响保持原位。

#wrapper {
  width:100%;
  height:580px;
   background-image:url('http://www.myorderdesk.com/Providers/206190/Files/31/full_width_image_1.jpg');
background-position: center center;
background-attachment:fixed;
background-repeat: no-repeat;
background-size: 100% 100%; 
/*background-size:cover;*/
-webkit-transition: background-image 0.4s;
-moz-transition: background-image 0.4s;
-ms-transition: background-image 0.4s;
-o-transition: background-image 0.4s;
transition: background-image 0.4s;
overflow: hidden;
-webkit-font-smoothing: subpixel-antialiased;
}

这是我的Demo

全屏Demo

Answer 1

请尝试覆盖：

#wrapper {
background-size:contain;
}

Answer 2

也许封面不是答案..来自W3schools：“将背景图像缩放到尽可能大，以便背景区域被背景图像完全覆盖。背景图像的某些部分可能不在视野中在后台定位中

CSS - 背景大小：封面太大了

2 个答案: