javascript - 改变DIV内图片的大小

Question

我正在尝试建立自己的网站作为投资组合网站。我正在尝试在 div 中添加图像，但是当图像变大时，div 也会变大。我只是想让图像大一点，但 div 大小相同。在这里你可以找到我的 jsfiddle:

https://jsfiddle.net/gckw3p9L/

我说的代码是这个:

<div class="bar">
  <div class="barStyle">
    <p class="paragraphBar"><img src="images/icon2.png" width="20px" height="20px" alt"Projects">TEST TEST.
    </p>
  </div>
</div>

我希望有人能帮助我。

Answer 1

希望对你有帮助

    .image-wrapper {
        display: inline-block;
        width: 100px;
        height:150px;
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;
        border: 1px solid black;
    }

<div class="image-wrapper" style="background-image: url('http://www.lorempixel.com/200/300')"></div>