0

我有点困惑。我尝试使用 CSS 调整图像大小。在 Safari 和 Chrome 中，图像会调整大小，而在 IE 和 Firefox 中，它会保持原始大小但会裁剪。我需要更改什么才能在 FF 和 IE 中调整其大小？CSS 如下所示：

body {
    background-color:black;
    width: 100%;
    height: 100%;
}

#image1 {
    background-image: url(img/myimage.png);
    background-size: 100% 100%;
    position: absolute;
    width: 532px;
    height: 250px;
    top: 100px;
    left: 100px;
}

和身体：

<body> <div id='image1'></div> </body>
4

3 回答 3

1

我还在 Firefox (17.0.1 -- OSX) 中尝试过你的代码。

有和没有

<!DOCTYPE html>

图像实际上按预期调整大小。

我猜你应该检查你的 CSS 中的拼写错误。

于 2012-12-17T08:07:43.177 回答
0

尝试固定背景位置，然后将其添加到您的 html 中。

<img src="img/myimage.png" alt="background image" id="image1" />

于 2012-12-16T22:33:16.213 回答
0

我认为您在中缺少 % 或 px

background-size: 100% 100;

我已经在 Chrome、IE 和 Firefox 中测试了这个 jsfiddle ，结果很好。我还添加了 no-repeat，以防需要放大较小的图像。

于 2012-12-16T22:12:25.663 回答