0

首先，我对此很陌生，所以请多多包涵。

我在我的网站上实现了一个非常酷的“滚动脚本淡入淡出”。

但是，我想做的是让图像在顶部跨度为 100% 宽度，就像fastcocreate 的网站一样。

这是我正在使用的 div：

<div class="home" style="background-image: url(http://payload51.cargocollective.com/1/7/237315/3336908/HomeImage_o.jpg); background-attachment: fixed; height: 560px; width: 100%; opacity: 1; background-position-y: 0px; background-position-x: center; background-repeat: no-repeat no-repeat; background-size: 100% 560px;"> 
</div>

现在我尝试添加“背景尺寸：100% 自动；” 到 div，它可以解决问题，除了这对我的文本做了奇怪的事情。例如，如果我让浏览器更苗条，文本不会随之移动——所以我放弃了这个想法。

接下来我将其更改为“背景尺寸：100% 560px;” 这解决了这个问题。但是另一种情况是，当您将浏览器缩小时，图像会被挤压，或者当我将浏览器变宽时，图像会被拉伸。

我觉得我更接近上面的那个，但我正在寻找拉伸图像问题的解决方案。我需要上传比当前尺寸更大的图片吗？

正如我之前所说，这些人做得很好。

4

1 回答 1

0

似乎 fastocreate 为其图像设置了最小宽度，您是否尝试过

min-width: 100%;
height: auto;

?

我很确定这就是 fastocreate 所做的

最好的，-b

*另外，请尝试在您的浏览器上启用“检查元素”。在尝试反映某人的风格时，它非常有用。

编辑：

作为对您的评论的回应，您可以尝试制作一个 jQuery 函数来调整它的大小。

例如

function resize(){
  var height = $('img').width / 2; //sets variable height to the width divided by 2
  $('img').height(height); // sets the value of the height to the variable height
};

或类似的东西。

于 2012-08-06T15:33:14.840 回答