html - 图片百分比不限制

Question

我有一个宽度为 60% 的 div。

CSS

#image {
    float:left;
    width:60%;
    background-image:url('cleaning.jpg');
}

HTML

<div id="image">
     <img src="cleaning.jpg" />
</div>

我的问题是图像在整个页面上以全尺寸显示!

如何将其限制在包含它的 div 中？

谢谢!

Answer 1

正如其他人所提到的，您似乎使用了两种相互竞争的技术 - 您在容器 div 上有一个背景图像，但容器 div 中也有相同的图像。选择一个。

对于背景图像技术，您可能想使用类似的东西:

#image {
    width: 60%;
    background:url('cleaning.jpg') no-repeat center center fixed; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}