Question

<div id="img-frame">
<img src="mypathimg.png"/>
</div>

使用img 100％可以使用，但它与Facebook不同，它缩小但显示图像的中心。

Answer 1

由于没有其他答案完成，请将标记更改为：

<div id="img-frame">
    <div style="background-image:url(yoururl.png)" class="img"></div>
</div>

现在添加CSS：

.img-frame > .img {
  background-size:cover;       /* Scale to fit optimistically */
  background-position:center;  /* Scale from center */
  width:100%;                  /* Same width as parent */
  height:100%;                 /* Same height as parent */
}

Answer 2

你试过了吗？

<div id="img-frame">
    <div style="background:url(mypathimg.png) 100% 100%;" />
</div>

Answer 3

你可以尝试：

<div id="img-frame">
    <div style="background-size: cover;" />
</div>

Answer 4

如果您不希望将图像作为背景图像，也可以将图像的宽度和高度设置为100％。您可能需要提供一个到目前为止的示例，并且更具体。

#img-frame{
    width:100px;
    height:100px;
}

#img-frame img{
    width:100%;
    height:100%;
}

Answer 5

你可以使用css3规则：background-size as

<div id="img-frame">
<div style='background:url(mypathimg.png) ;background-size:contain;' ></div>

如何强制图像背景适合较小的div中心

5 个答案: