Question

我希望我的背景可以在宽度上缩放，但不能在高度上缩放。

我现在得到了以下代码。

background: url(images/background.jpg) no-repeat center center fixed; 
-webkit-background-size: cover;
 -moz-background-size: cover;
-o-background-size: cover;
background-size: cover;

使用此代码，backgroundimage会缩放整个内容，但我只希望它在宽度上缩放。有人有解决方案吗？

问候

Answer 1

而不是cover，您可以尝试这样的事情。

background-size: 100% $IMAGE_HEIGHT;

$IMAGE_HEIGHT是您正在使用的背景的高度。

<强> JSFiddle

Answer 2

您可以尝试使用background-size属性并设置/拉伸宽度，或者如果它适用于您的情况，请尝试使用值repeat-x的background-repeat属性：

{
    background-size: 100% auto; # width and height, can be %, px or whatever.
}

{
    background-repeat:repeat-x;
}

仅在宽度上缩放背景

2 个答案: