0

我想在 div 中插入图像，但我有问题：图像溢出到 div 之外！面向对象

（对不起我的英语）这就是代码 HTML

 <div class='immagine2'><img src='http://farm4.staticflickr.com/3822/9522792825_c68706706d_o.jpg'></div>

和CSS...

 div.immagine2 {
      position:relative;
      width:500px;
      height:410px;
      margin: 30px 30px 30px auto; 
  }

 div.immagine2 img {
      float:left;
 position:absolute;
 left:50%;
 top:50%;
      margin-left:-155px;
 margin-top:-75px;
  }

这里是链接。怎么了？

重要的！！！：我希望该图像向左流动，因为我想在右侧添加文本！

4

4 回答 4

2

将其添加overflow: hidden到以下 id：

div.immagine2 {
    overflow:hidden;
    ...
}

这将有效地防止超出 div 的任何内容在页面上显示。希望能帮助到你！！

于 2013-08-16T17:53:02.720 回答
1

只需将图像放入divwithtext-align: center

<div style="text-align:center;">
  <img src="....">
</div>
于 2013-08-16T18:02:08.657 回答
0

添加overflow: hidden,overflow: auto或overflow: scroll到您的.immagine2容器将防止图像“溢出”其容器，但会导致剪切或滚动，具体取决于您如何设置overflow.

如果您只想将其包含<img>在其容器中，请设置max-width: 100%：

.immagine2 img { max-width: 100%; }

编辑

要将图像居中并将其保留在文档流中，请尝试以下操作：

div.immagine2 {
    margin: 30px auto; 
    width: 500px;
    height: 410px;
    overflow: hidden;
}

div.immagine2 img {
    margin: auto;
    display: block;
}
于 2013-08-16T18:11:28.757 回答
0

将背景图像添加到您的 CSS 中（正如评论者所说，如果您希望使用不同的图像，这是无效的）。 

  background-image: url(../images/picture.jpg)

您可以在 CSS 中使用多种背景设置。

background-size: 100%;

如果您使用 px ，则可以指定图像应占用的大小。

background-size: 30px 40px;
于 2013-08-16T17:47:42.197 回答